marek/i2p.i2p
1
0
Fork 0
forked from I2P_Developers/i2p.i2p
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Second draft of CSS updates

Browse Source 
- More responsive layout
- Accessibility tweaks
- Further consolidation of look & feel between console and webapps
This commit is contained in:
str4d
2017-01-07 17:47:01 +00:00
parent 04b9b202e5
commit fabc57b57a
34 changed files with 3394 additions and 1685 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1294
installer/resources/themes/console/classic/console.css
View File

File diff suppressed because it is too large Load Diff

165
installer/resources/themes/console/classic/i2ptunnel.css
View File

@@ -7,9 +7,8 @@ body {
text-align: center;
font-family: "Droid Sans", "Noto Sans", "Ubuntu", "Segoe UI", Verdana, Helvetica, sans-serif;
color: #333;
font-size: 10pt;
background: #a4a4cb url('images/tile2.png');
background-size: 32px 32px;
font-size: 9pt;
background: #a4a4cb url(images/bg.png);
}
body.iframed {
@@ -30,52 +29,6 @@ form {
margin: 0;
}
input[type="checkbox"], input[type="radio"] {
vertical-align: middle;
min-width: 16px;
min-height: 16px;
margin: 0;
}
textarea, input, select, button {
font-size: 9pt;
vertical-align: middle;
}
button {
text-decoration: none;
}
button, input[type="submit"], input[type="reset"], a.control {
font-family: "Droid Sans", "Noto Sans", "Ubuntu", "Segoe UI", Verdana, Helvetica, sans-serif;
font-size: 9pt;
}
textarea {
color: #333;
background: #fff;
border: 1px solid #999;
border-radius: 2px;
resize: none;
box-shadow: inset 2px 2px 1px #ccc;
}
textarea:focus {
box-shadow: inset 0 0 0 1px #89f;
color: #111;
}
textarea#statusMessages {
width: 99%;
width: calc(100% - 8px);
border-radius: 0;
padding: 2px 4px;
color: #070;
box-shadow: none;
border: none;
margin: 0;
}
br {
clear: left;
}
@@ -85,7 +38,7 @@ div.statusNotRunning {
height: 16px;
overflow: hidden;
color: #d00;
background: url('images/console_status_stopped.png') center center no-repeat;
background: url(images/console_status_stopped.png) center center no-repeat;
padding-top: 24px;
filter: drop-shadow(0 0 1px #999);
-webkit-filter: drop-shadow(0 0 1px #999);
@@ -96,7 +49,7 @@ div.statusRunning {
height: 16px;
overflow: hidden;
color: #0b0;
background: url('images/console_status_running.png') center center no-repeat;
background: url(images/console_status_running.png) center center no-repeat;
filter: drop-shadow(0 0 1px #999);
-webkit-filter: drop-shadow(0 0 1px #999);
}
@@ -107,7 +60,7 @@ div.statusStarting {
height: 16px;
overflow: hidden;
color: #339933;
background: url('images/console_status_starting.png') center center no-repeat;
background: url(images/console_status_starting.png) center center no-repeat;
filter: drop-shadow(0 0 1px #999);
-webkit-filter: drop-shadow(0 0 1px #999);
}
@@ -180,8 +133,8 @@ hr {
.control:hover, .control:focus {
text-decoration: none;
color: #111;
border: 1px solid #f60 !important;
color: #111 !important;
border: 1px solid #89f !important;
background: #ddd;
background: linear-gradient(to bottom, #ddd 0%, #fff 100%);
box-shadow: inset 0 0 0 1px #fff !important;
@@ -189,6 +142,8 @@ hr {
.control:active {
box-shadow: inset 2px 2px 1px #999 !important;
border: 1px solid #999 !important;
color: #333 !important;
}
.iframed .panel.iframed {
@@ -198,8 +153,8 @@ hr {
.panel {
width: calc(100% - 14px);
margin: 8px auto;
min-width: 450px;
max-width: 1400px;
min-width: 600px;
max-width: 1500px;
overflow: hidden;
text-align: left !important;
border-radius: 2px;
@@ -242,6 +197,10 @@ select:focus {
box-shadow: 0 0 1px #89f;
}
select option {
background: #fff;
}
@-moz-document url-prefix() { /* target firefox and derivatives only */
select {
-moz-appearance: none;
@@ -260,7 +219,7 @@ select:focus {
}
a:link {
color: #006;
color: #33a;
text-decoration: none;
font-weight: bold;
word-wrap: break-word;
@@ -324,7 +283,7 @@ h3 {
}
th {
background: #fff url("/themes/console/classic/images/tinytitle.png") repeat right center;
background: #fff url(/themes/console/classic/images/tinytitle.png) repeat-x center center;
background: linear-gradient(to bottom, #fff 0%, #fff 50%, #eff2ff 50%, #eff2ff 100%);
padding: 5px;
border-top: 1px solid #89f;
@@ -344,7 +303,7 @@ td {
}
td.infohelp {
background: url(images/infohelp.png) 10px center no-repeat;
background: url(/themes/console/images/info/infohelp.png) 10px center no-repeat;
background-size: 24px 24px;
background-position: 6px center;
padding: 10px 10px 10px 38px !important;
@@ -444,13 +403,57 @@ th.tunnelControl {
text-align: center;
}
/*
.tunnelControl .control {
min-width: 60px !important;
display: inline-block;
margin: 0 !important;
input[type="checkbox"], input[type="radio"] {
vertical-align: middle;
min-width: 16px;
min-height: 16px;
margin: 0;
}
textarea, input, select, button {
font-size: 9pt;
vertical-align: middle;
}
button::-moz-focus-inner, input::-moz-focus-inner {
outline: none;
border: none;
}
button {
text-decoration: none;
}
button, input[type="submit"], input[type="reset"], a.control {
font-family: "Droid Sans", "Noto Sans", "Ubuntu", "Segoe UI", Verdana, Helvetica, sans-serif;
font-size: 9pt;
}
textarea {
color: #333;
background: #fff;
border: 1px solid #999;
border-radius: 2px;
resize: none;
box-shadow: inset 2px 2px 1px #ccc;
}
textarea:focus {
box-shadow: inset 0 0 0 1px #89f;
color: #111;
}
textarea#statusMessages {
width: 99%;
width: calc(100% - 8px);
border-radius: 0;
padding: 2px 4px;
color: #070;
box-shadow: none;
border: none;
margin: 0;
}
*/
a.control {
display: inline-block;
@@ -473,6 +476,10 @@ a.control {
border-top: 1px solid #89f;
}
button.control, input[type="submit"], input[type="reset"] {
padding: 5px 8px !important;
}
.buttons > * {
vertical-align: middle;
}
@@ -524,7 +531,7 @@ input {
margin: 3px 0 !important;
}
#localDestination {
#localDestination, .authentication {
height: 30px !important;
}
@@ -612,14 +619,12 @@ table#statusMessages textarea, table#statusMessages textarea:active {
}
input::-moz-placeholder {
color: #f00;
font-weight: bold;
color: #900;
opacity: 1;
}
::-webkit-input-placeholder {
color: #f00;
font-weight: bold;
color: #900;
opacity: 1;
}
@@ -732,7 +737,7 @@ input.tunnelName, input.tunnelDescription, #userAgents {
}
#wizardPanel p {
padding: 5px;
padding: 5px 10px;
margin: 0;
text-align: justify;
}
@@ -799,7 +804,7 @@ input[type="checkbox"] {
margin: 5px !important;
}
textarea[name="accessList"], #hostField, #localDestination {
textarea[name="accessList"], #hostField, #localDestination, .authentication {
width: calc(100% - 15px) !important;
margin: 5px !important;
}
@@ -832,3 +837,19 @@ td.tunnelDestination, td.tunnelDescription {
}
/* end more space */
/* responsive layout */
@media screen and (min-width: 1200px) {
body, .control, button, select, textarea, .freetext {
font-size: 10pt !important;
}
th {
font-size: 10.5pt;
}
h2, h3 {
font-size: 12pt;
}
}

40
installer/resources/themes/console/dark/console.css
View File

@@ -16,6 +16,16 @@ body {
display: none;
}
::selection {
background: #030 !important;
color: white;
}
::-moz-selection {
background: #030 !important;
color: white;
}
div.clearer {
clear: left;
height: 0;
@@ -613,6 +623,7 @@ div.sorry {
.main#dns {
padding: 0 0 3px;
min-width: 650px !important;
background: #000;
}
.main#webmail, .main#torrents {
@@ -1899,7 +1910,7 @@ th.smallhead {
.tablefooter tr, .tablefooter td {
background: #000 url(images/header.png) repeat-x center center !important;
background: linear-gradient(to bottom, #001400, #001000 50%, #000 100%) !important;
border-top: 1px solid #494;
border-top: 1px solid #494 !important;
border-bottom: 1px solid #494 !important;
line-height: 110%;
padding: 6px 10px;
@@ -3202,6 +3213,10 @@ th > img[src^="/imagegen"] { /* scale down header images */
margin: -6px -11px !important;
}
#criticallogs ul:empty {
display: none;
}
table#enviro, table#criticallogs, table#routerlogs, table#eventlogs, table#wrapperlogs {
margin-top: -11px;
}
@@ -3224,6 +3239,7 @@ table#enviro td:first-child {
width: 100px;
text-align: right;
padding-right: 0;
white-space: nowrap;
}
table#criticallogs td , table#routerlogs td, table#eventlogs td, table#wrapperlogs td {
@@ -4899,7 +4915,7 @@ form[action="events"] {
/* responsive layout */
@media screen and (min-width: 1500px) {
body, .main, .main td, .news p, #news p {
body, .main, .main td, .news p, #news p, textarea, .main textarea, code, tt, pre {
font-size: 10pt !important;
}
@@ -4928,10 +4944,6 @@ body, .main, .main td, .news p, #news p {
font-size: 9pt !important;
}
.routersummary h3 a {
font-size: 11pt !important;
}
div.app {
min-width: 138px;
}
@@ -4949,7 +4961,19 @@ table#floodfills th:first-child, table#floodfills td:first-child {
padding-right: 3px !important;
}
h3 {
font-size: 11pt;
h3, .routersummary h3 a, th.th_title, #leasesetdebug th, #leasesetsummary th, .netdbentry th {
font-size: 11pt !important;
}
select {
padding: 3px 16px 3px 2px;
}
h3#pluginmanage {
margin-bottom: -15px !important;
}
h4#updateplugins {
margin-top: -15px !important;
}
}

52
installer/resources/themes/console/dark/i2ptunnel.css
View File

@@ -17,6 +17,16 @@ body.iframed {
overflow: hidden;
}
::selection {
background: #030 !important;
color: white;
}
::-moz-selection {
background: #030 !important;
color: white;
}
div {
-moz-box-sizing: border-box;
box-sizing: border-box;
@@ -322,7 +332,9 @@ textarea:focus {
color: #ee9;
background: #000 !important;
filter: drop-shadow(0 0 1px #880);
-webkit-filter: drop-shadow(0 0 1px #880);
transition: ease filter 0.3s 0s;
box-shadow: inset 0 0 1px #880;
}
textarea#statusMessages, textarea#statusMessages:active {
@@ -330,7 +342,7 @@ textarea#statusMessages, textarea#statusMessages:active {
border: 0;
box-shadow: none;
height: 80px;
font-size: 9pt;
font-size: 8.5pt;
width: 100%;
border-radius: 0;
padding: 2px 4px;
@@ -386,7 +398,8 @@ input {
text-decoration: none;
}
input[type="submit"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner {
input[type="submit"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner,
button::-moz-focus-inner {
border: none;
outline: none;
}
@@ -422,6 +435,10 @@ input[type="text"], input[type="password"], textarea, textarea[readonly="readonl
color: #bb7;
}
textarea[readonly="readonly"]:focus {
box-shadow: inset 0 0 0 1px #880;
}
input[type="text"]:focus, input[type="password"]:focus {
color: #ee9;
background: #000;
@@ -458,9 +475,10 @@ a.control, input.control {
border-radius: 2px;
vertical-align: middle;
text-decoration: none;
padding: 4px 2px !important;
padding: 5px 8px !important;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
}
.control:link {
@@ -493,7 +511,6 @@ a.control, input.control {
box-shadow: inset 0 0 0 1px #000;
box-sizing: border-box;
min-width: 70px !important;
padding: 4px 8px !important;
}
.control:hover, .control:focus {
@@ -508,23 +525,18 @@ a.control, input.control {
color: #ee9 !important;
text-decoration: none;
box-shadow: inset 0 0 0 1px #000 !important;
box-shadow: inset 0 0 0 1px #000, inset 3px 3px 3px #000 !important;
}
a.control {
display: inline-block;
}
button.control {
box-sizing: border-box;
-moz-box-sizing: border-box;
padding: 3px 4px !important;
}
select {
color: #494;
font: 8pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Lato, "Segoe UI", Verdana, Helvetica, sans-serif;
font-weight: bold;
padding: 2px 16px 2px 3px;
padding: 3px 16px 3px 3px;
background: #000;
border-radius: 2px;
cursor: pointer;
@@ -540,6 +552,10 @@ select option { /* dropdown menu reverts to normal font-weight */
font-size: 9.5pt;
}
select option:hover, select option:checked {
box-shadow: inset 0 0 20px 20px #f60;
}
select:focus, select:hover {
color: #f60;
border: 1px solid #f60;
@@ -935,9 +951,21 @@ textarea[name="accessList"], #hostField, #localDestination, .authentication {
color: #bb7;
}
td.tunnelDestination, td.tunnelDescription {
background: linear-gradient(to right, #000 50%, #010);
}
/* end more space */
/* responsive layout */
@media screen and (min-width: 1400px) {
body, td, a {
font-size: 10pt;
}
button, input, .control, select, textarea#statusMessages, .freetext, textarea {
font-size: 9pt;
}
}

271
installer/resources/themes/console/light/console.css
View File

@@ -9,9 +9,9 @@ html {
body {
margin: 8px 6px 8px 8px;
text-align: center;
color: #001;
font: 9pt/130% "Droid Sans", Ubuntu, "Noto Sans", "Bitstream Vera Sans", "Segoe UI", "Lucida Grande", Verdana, Helvetica, sans-serif;
background: #a4a4cb url(images/tile2.png);
color: #333;
font: 9pt/130% "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
background: #a4a4cb url(images/tile2.png) fixed;
background-size: 32px 32px;
}
@@ -73,52 +73,6 @@ pre {
margin: 10px;
}
div.logo {
float: left;
padding: 10px;
text-align: center;
color: #222;
margin: 0 10px;
border: 1px solid #447;
border-radius: 2px;
background: #fff;
width: 185px;
box-shadow: inset 0 0 0 1px #bbf;
}
div.toolbar {
margin: 0;
padding: 10px;
font-weight: bold;
background: #ffe;
border: 1px solid #447;
display: none !important;
}
div.toolbar a:link {
border: 1px outset #ddddc0;
padding: 0 5px 1px 5px;
line-height: 250%;
background: #bbf;
text-decoration: none;
border-radius: 2px;
display: none !important;
}
div.toolbar a:visited {
background: #ffe;
}
div.toolbar a:hover {
border: 1px solid #eeffef;
background: #003;
color: #f60;
}
a:active {
color: #900;
}
div.routersummaryouter {
float: left;
width: 200px;
@@ -137,7 +91,7 @@ div.routersummary {
margin-bottom: 8px;
text-align: center !important;
border: 1px solid #447;
color: #000;
color: #333;
font-size: 8pt;
clear: left;/* fixes a bug in Opera */
border-radius: 2px;
@@ -211,9 +165,6 @@ div.routersummary hr.b {
margin-bottom: 5px;
}
div.routersummary hr:last-child {
}
div.routersummary h3 {
font-size: 9.5pt;
letter-spacing: 0.04em;
@@ -228,6 +179,7 @@ div.routersummary h3 {
border-radius: 0;
box-shadow: inset 0 0 0 1px #fff;
filter: none;
-webkit-filter: none;
}
.routersummary h3:hover {
@@ -249,12 +201,13 @@ div.routersummary h3 a {
display: inline-block;
width: 100%;
width: calc(100% - 4px);
padding: 2px 0;
}
div.routersummary h4 {
border: none;
font-size: 8.5pt;
letter-spacing: 0.02em;
letter-spacing: normal;
text-transform: none;
margin: -7px;
padding: 6px 2px !important;
@@ -266,6 +219,12 @@ div.routersummary h4 {
line-height: 105%;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
.routersummary h4 {
margin-bottom: -8px !important;
}
}
h4.sb_info {
margin-top: -11px !important;
}
@@ -275,10 +234,6 @@ h4.sb_info + hr + form {
margin-bottom: -1px;
}
.routersummary a:link {
padding: 2px;
}
div.routersummary ul {
text-align: left !important;
}
@@ -315,6 +270,11 @@ div.routersummary table {
padding-right: 0;
}
#sb_internals a, #sb_advanced a {
padding: 1px 2px;
display: inline-block;
}
div.routersummary tr {
background-image: none !important;
background-color: transparent !important;
@@ -408,12 +368,30 @@ div.refresh {
/* proxy error messages */
div.logo {
float: left;
padding: 10px;
text-align: center;
color: #222;
margin: 0 10px;
border: 1px solid #447;
border-radius: 2px;
background: #fff;
width: 185px;
box-shadow: inset 0 0 0 1px #bbf;
}
.logo hr {
margin: 8px -11px;
background: #447;
}
div.warning {
margin: 20px 20px 30px 240px;
padding: 5px 25px 20px 75px;
padding: 10px 25px 20px 75px;
background: #fff;
border: 1px solid #447;
color: inherit;
color: #333;
border-radius: 2px;
text-align: justify;
background-image:url(/themes/console/images/itoopie_sm.png);
@@ -424,6 +402,65 @@ div.warning {
min-width: 400px;
}
.warning h3 {
text-align: left;
}
.proxyfooter {
margin: 0 20px 10px 240px;
padding: 20px 25px 20px 75px;
color: #f00;
font-size: 7pt;
text-align: right !important;
border-radius: 2px;
border: 1px solid #447;
display: none;
}
@media screen and (max-width: 800px) {
.warning {
margin-left: 20px !important;
background: #fff !important;
padding-left: 25px !important;
}
.logo {
display: none;
}
}
@media screen and (min-height: 700px) {
.proxyfooter {
position: absolute;
bottom: 0;
right: 0;
padding: 0 20px 0 0;
text-align: right;
background: #030;
width: 100%;
opacity: 0.7;
border-top: 1px solid #000;
}
.proxyfooter p {
text-align: right;
line-height: 130% !important;
margin: 5px 0;
}
.warning {
margin-bottom: 30px;
}
}
@media screen and (max-height: 700px) {
.proxyfooter {
display: none;
}
}
/* end proxy error messages */
/* console error messages */
div.sorry {
@@ -585,7 +622,7 @@ div.news {
box-shadow: inset 0 0 0 1px #bbf;
background: #fff url(/themes/snark/ubergine/images/hat.png) no-repeat scroll right bottom;
background: url(/themes/snark/ubergine/images/hat.png) no-repeat scroll right bottom, linear-gradient(to right, #fff, #f7f8ff, #fff);
min-width: 500px;
min-width: 526px;
filter: drop-shadow(0 1px 1px #999);
-webkit-filter: drop-shadow(0 1px 1px #999);
}
@@ -716,8 +753,8 @@ div.newscontent h6 {
@media screen and (-webkit-min-device-pixel-ratio:0) {
.tab {
margin: -5px -2px -1px -4px;
padding: 1px 6px 1px 7px;
margin: -5px -2px -1px -3px;
padding: 1px 8px 1px 7px;
}
.tab:first-child {
@@ -726,6 +763,7 @@ div.newscontent h6 {
.tab2 {
margin-left: -2px !important;
margin-right: -1px !important;
}
}
@@ -764,7 +802,7 @@ div.newscontent h6 {
}
.tab2 {
color: #008;
color: #31334f;
padding: 2px 5px 1px;
margin: -11px -1px -1px -3px;
background: #fff;
@@ -913,7 +951,7 @@ h3#advancedclientconfig, p#webappconfigtext, p#pluginconfigtext, p#clientconf.in
}
h3#pluginconfig, h3#webappconfig, h3#i2pclientconfig, h3#pluginmanage, p#clientconf.infohelp, #config_stats h3 {
margin-bottom: -15px;
margin-bottom: -13px;
}
p#enablefullstats {
@@ -1230,7 +1268,7 @@ tr:nth-child(odd) {
td {
padding: 3px 5px;
color: #222;
color: #333;
vertical-align: middle;
border-top: 1px inset #cfd1ff;
border-bottom: 1px outset #cfd1ff;
@@ -1415,11 +1453,17 @@ table.search td:nth-child(3) {
padding-left: 0;
}
table.search input[type="text"], table.search select {
table.search input[type="text"] {
min-width: 40px !important;
width: 100%;
}
table.search select {
min-width: 80px;
width: 100%;
text-overflow: ellipsis;
}
img.app, img.app2p {
width: auto;
height: 32px;
@@ -1468,9 +1512,11 @@ div.applabel {
.applabel a {
display: inline-block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* end home page */
tt {
@@ -1838,7 +1884,7 @@ h1 {
background: #fff;
border: 1px solid #447;
border-radius: 2px;
min-width: 520px;
min-width: 526px;
filter: drop-shadow(0 0 1px #999);
-webkit-filter: drop-shadow(0 0 1px #999);
}
@@ -2052,7 +2098,7 @@ input, input:visited, button, button:visited {
background: linear-gradient(to bottom, #fff 0%, #ddd 100%);
color: #333;
margin: 3px;
font: 9pt "Droid Sans", Ubuntu, "Noto Sans", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
padding: 4px 5px;
text-decoration: none;
border-radius: 2px;
@@ -2463,7 +2509,7 @@ button::-moz-focus-inner, input[type="submit"]::-moz-focus-inner, input[type="re
input[type="text"], input[type="password"] {
background: #fff;
box-shadow: inset 1px 1px 1px #999;
font-family: "Droid Sans", Ubuntu, "Noto Sans", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
}
input[type="text"]:focus, input[type="password"]:focus {
@@ -2479,8 +2525,17 @@ input[type="file"] {
box-shadow: none;
}
input[type="checkbox"] {
input[type="checkbox"], input[type="radio"] {
border: 0 !important;
box-shadow: none;
vertical-align: middle !important;
margin-top: 4px !important;
margin-bottom: 4px !important;
}
input[type="checkbox"]:focus, input[type="radio"]:focus {
filter: drop-shadow(0 0 2px #89f);
-webkit-filter: drop-shadow(0 0 2px #89f);
}
select {
@@ -2490,7 +2545,7 @@ select {
padding: 4px;
border: 1px solid #999;
min-width: 120px;
font: 9pt "Droid Sans", Ubuntu, "Noto Sans", "Bitstream Vera Sans", Verdana, "Lucida Sans Unicode", Helvetica, sans-serif;
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
border-radius: 2px;
text-align: left !important;
box-shadow: inset 0 0 0 1px #fff;
@@ -2555,17 +2610,6 @@ textarea:focus {
filter: drop-shadow(0 0 1px #89f);
}
.proxyfooter {
margin: 0 20px 10px 240px;
padding: 20px 25px 20px 75px;
color: #f00;
font-size: 7pt;
text-align: right !important;
border-radius: 2px;
border: 1px solid #447;
display: none;
}
.statusnotes {
font-style: normal;
font-size: 9pt;
@@ -3540,6 +3584,11 @@ ul#banlist {
word-spacing: 0.1em;
}
#tunnelconfig font[color="red"] {
background: url(images/warn.png) left center no-repeat;
padding: 4px 5px 4px 20px;
}
#tunnelconfig td:nth-child(n+2) {
text-align: left;
}
@@ -3707,6 +3756,8 @@ table#floodfills th {
color: #001 !important;
filter: none;
-webkit-filter: none;
outline: none;
line-height: 140%;
}
.main#jardump {
@@ -3718,6 +3769,26 @@ table#floodfills th {
border: none;
}
#jardump tt {
letter-spacing: -0.03em;
}
#jardump a tt {
color: #359;
}
#jardump a:visited tt {
color: #218;
}
#jardump a:hover tt {
color: #f60;
}
#jardump a:active tt {
color: #f90;
}
/* experimental sidebar navigation for webapps */
#sb_services a:link, #sb_services a:visited {
@@ -3809,6 +3880,11 @@ table#floodfills th {
margin-left: 0;
}
.homelinkedit img {
width: auto;
height: 20px;
}
#clientconfig th:first-child, #webappconfig th:first-child, #pluginconfig th:first-child {
text-align: right;
padding-right: 10%;
@@ -3917,6 +3993,21 @@ a[href^="configpeer?peer"]:hover {
/* responsive layout */
@media screen and (max-width: 800px) {
div.app {
width: 112px !important;
min-width: 0;
}
.applabel {
width: 100px !important;
}
img.app, img.app2p {
padding: 10px 35px;
}
}
@media screen and (min-width: 1500px) {
body, .main, .main td, .news p, #news p, .tab, .tab2, .main li b, div.joblog li, .themelabel, .ui_lang, .applabel a,
#peerdefs, #profile_defs, #thresholds, #configinfo, .infohelp, .infowarn, button, input, select, textarea {
@@ -3928,6 +4019,10 @@ code, tt, div.news {
font-size: 9pt !important;
}
button[class^="X"] {
font-size: 0 !important;
}
.main, .news, h1 {
margin-left: 232px !important;
}
@@ -3968,4 +4063,12 @@ div.app {
.footnote {
font-size: 8pt !important;
}
h3#pluginconfig, h3#webappconfig, h3#i2pclientconfig, h3#pluginmanage, p#clientconf.infohelp, #config_stats h3 {
margin-bottom: -15px;
}
#jardump tt, #jardump td {
font-size: 9pt !important;
}
}

52
installer/resources/themes/console/light/i2ptunnel.css
View File

@@ -8,7 +8,7 @@ body {
text-align: center;
font-family: "Droid Sans", "Noto Sans", "Ubuntu", "Segoe UI", Verdana, Helvetica, sans-serif;
color: #333;
font-size: 10pt;
font-size: 9pt;
background: #a4a4cb url(images/tile2.png);
background-size: 32px 32px;
}
@@ -164,6 +164,11 @@ hr {
width: 100px;
}
.control::-moz-focus-inner {
outline: none;
border: none;
}
.control, .control:link, .control:visited {
text-align: center;
white-space: nowrap;
@@ -184,6 +189,10 @@ hr {
padding: 4px 8px;
}
button.control, input.control {
padding: 5px 8px !important;
}
.control:hover, .control:focus {
text-decoration: none;
color: #111;
@@ -195,6 +204,7 @@ hr {
.control:active {
box-shadow: inset 2px 2px 1px #999 !important;
color: #333;
}
a.control {
@@ -208,7 +218,7 @@ a.control {
.panel {
width: calc(100% - 14px);
max-width: 1200px;
max-width: 1400px;
margin: 8px auto;
min-width: 450px;
overflow: hidden;
@@ -457,6 +467,10 @@ div[class^="status"] {
width: 20%;
}
.tunnelLocation font[color="red"] {
margin-left: 2px;
}
.tunnelStatus {
text-align: center;
width: 10%;
@@ -553,12 +567,12 @@ select#profile, select#connectionProfile {
.multiOption#isServer {
background: url(/themes/console/images/server.png) left center no-repeat;
padding-left: 20px;
padding-left: 18px;
}
.multiOption#isClient {
background: url(/themes/console/images/client.png) left center no-repeat;
padding-left: 21px;
padding-left: 18px;
}
td#throttle {
@@ -625,13 +639,11 @@ table#statusMessages textarea, table#statusMessages textarea:active {
input::-moz-placeholder {
color: #f00;
font-weight: bold;
opacity: 1;
}
::-webkit-input-placeholder {
color: #f00;
font-weight: bold;
opacity: 1;
}
@@ -686,10 +698,6 @@ input.tunnelName, input.tunnelDescription, #userAgents {
/* wizard specifics */
#wizardPanel {
font-size: 10pt;
}
#wizardTable {
padding: 0;
}
@@ -720,16 +728,6 @@ input.tunnelName, input.tunnelDescription, #userAgents {
margin-top: -1px;
}
/*
#wizardPanel tr:nth-child(n+2) {
background: #eef;
}
#wizardPanel tr:nth-child(2n+2) {
background: #f7f8ff;
}
*/
#wizardTunnelTypes tr:nth-child(even), #wizardSummary tr:nth-child(even) {
background: #eef;
}
@@ -747,7 +745,7 @@ input.tunnelName, input.tunnelDescription, #userAgents {
}
#wizardPanel p {
padding: 5px;
padding: 5px 10px;
margin: 0;
text-align: justify;
}
@@ -858,3 +856,15 @@ td.tunnelDestination, td.tunnelDescription {
margin-left: 5px;
}
/* end more space */
/* responsive layout */
@media screen and (min-width: 1500px) {
body, select, .control, input, textarea {
font-size: 10pt !important;
}
th {
font-size: 10.5pt;
}
}

67
installer/resources/themes/console/midnight/console.css
View File

@@ -12,7 +12,7 @@ body {
background: linear-gradient(to bottom, #001, #000);
background-size: auto 2px;
color: #c9ceff;
font: 8.5pt/130% "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Verdana, Helvetica, sans-serif;
font: 8.5pt/130% "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
}
.hide, .hideme {
@@ -45,7 +45,7 @@ button, input[type="submit"], input[type="reset"], select {
}
button, button:visited, input[type="submit"], input[type="reset"] {
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Verdana, Helvetica, sans-serif;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
border: 1px solid #3e3f8f;
border-bottom-color: #14144f;
border-right-color: #14144f;
@@ -87,7 +87,7 @@ input {
background: #000;
color: #443da0;
margin: 5px;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Verdana, Helvetica, sans-serif;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
padding: 3px 2px;
text-decoration: none;
min-width: 110px;
@@ -114,7 +114,7 @@ input[type=text], input[type=password] {
color: #c9ceff;
margin: 5px 10px;
padding: 4px 2px;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Verdana, Helvetica, sans-serif;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
border: 1px solid #443da0 !important;
text-decoration: none;
border-radius: 2px;
@@ -222,7 +222,7 @@ select {
border-right-color: #14144f;
border-radius: 2px;
min-width: 110px;
font: 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Verdana, Helvetica, sans-serif;
font: 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
font-weight: bold;
padding: 3px 16px 3px 2px;
cursor: pointer;
@@ -243,7 +243,7 @@ select option {
}
select option:hover, select option:focus, select option:checked {
box-shadow: inset 0 0 20px 20px #114;
box-shadow: inset 0 0 20px 20px #652787;
}
@-moz-document url-prefix() { /* target firefox and derivatives only */
@@ -3099,6 +3099,7 @@ table#i2pupdates input[name*="URL"], table#i2pupdates textarea {
table#i2pupdates tr:last-child td {
padding-right: 6px;
background: #000 !important;
}
form[action="graphs"] {
@@ -3625,7 +3626,7 @@ table#profiles td:first-child, table#profiles th:first-child {
table#profiles td:first-child {
text-align: right !important;
padding-left: 1px;
padding-left: 4px;
}
table#profiles td:first-child, table#profiles th:first-child, table#profiles td:nth-last-child(2), table#profiles th:nth-last-child(2) {
@@ -3735,7 +3736,7 @@ table#floodfills th:first-child, table#floodfills td:first-child {
table#floodfills td:first-child {
text-align: right !important;
padding-left: 1px !important;
padding-left: 4px !important;
padding-right: 5px !important;
}
@@ -4168,6 +4169,7 @@ iframe.iframed {
.main#dns {
padding: 0;
min-width: 650px;
background: #000 !important;
}
#susidnsframe {
@@ -4196,26 +4198,9 @@ body.iframed {
/* Override error log colors */
font[color="#ff00cc"] { /* warning */
color: #070088;
}
font[color="#ff3300"] { /* critical */
color: #0b0099;
}
font[color="#cc0000"] { /* error */
color: #0e00cc;
}
font[color="#000099"] { /* info */
color: #060055;
}
font[color="#006600"] { /* debug */
color: #EBDBFF;
color: #ebdbff;
}
/*--*/
font[color="#ff00cc"] { /* warning */
color: #0028a0;
@@ -4655,7 +4640,7 @@ h3#webappconfig {
p#webappconfigtext {
margin: 1px 0 -2px 0;
background: url(/themes/console/images/info/java_edit.png) 12px center no-repeat !important;
background: #000 url(/themes/console/images/info/java_edit.png) 12px center no-repeat !important;
background-size: 28px 28px !important;
}
@@ -4723,7 +4708,6 @@ input#hideme {
#pluginupdater {
border: 1px solid #443da0;
padding: 5px;
margin-top: -11px;
margin-bottom: 10px !important;
background: #000;
@@ -4804,6 +4788,7 @@ table#configstats {
#configstats tr.tablefooter td {
padding: 4px 10px;
line-height: 140%;
background: #000 !important;
}
p#enablefullstats {
margin-top: 5px;
@@ -4987,7 +4972,7 @@ form[action="events"] {
/* responsive layout */
@media screen and (min-width: 1500px) {
body, .main, .main td, .news p, #news p, .statusnotes {
body, .main, .main td, .news p, #news p, .statusnotes, textarea, pre, tt, code {
font-size: 10pt !important;
}
@@ -4996,10 +4981,14 @@ h1 {
padding: 15px;
}
.main button, .main input, select, textarea {
.main button, .main input, select {
font-size: 9pt !important;
}
button[class^="X"] {
font-size: 0 !important;
}
.main, .news, h1 {
margin-left: 232px !important;
}
@@ -5021,7 +5010,7 @@ h1 {
width: 216px !important;
}
.routersummary td, .routersummary a, .routersummary button, .routersummary h4, .routersummary h4 a {
.routersummary td, .routersummary a, .routersummary button, .routersummary h4, .routersummary h4 a, .smallhead, .applabel a {
font-size: 9pt !important;
}
@@ -5041,15 +5030,19 @@ div.app {
width: 134px !important;
}
.applabel a {
font-size: 9pt !important;
}
.themelabel {
padding: 2px;
}
code, tt {
font-size: 9pt !important;
h3#i2pclientconfig, h3#pluginconfig, h3#pluginfromurl, h3#pluginfromfile, #clientconf.infohelp, h3#pluginmanage, h3#webappconfig {
margin-bottom: -15px !important;
}
h4#updateplugins {
margin-top: -15px !important;
}
#profiles td:first-child, #profiles th:first-child, #floodfills td:first-child, #floodfills th:first-child {
width: 56px !important;
}
}

39
installer/resources/themes/console/midnight/i2ptunnel.css
View File

@@ -12,7 +12,7 @@ body {
}
body.iframed {
background: transparent url('images/transparent.gif') !important;
background: transparent url(/themes/console/images/transparent.gif) !important;
padding: 0;
overflow: hidden;
}
@@ -439,28 +439,6 @@ a.control, input.control {
vertical-align: middle;
}
.control {
margin: 2px 0 0 2px !important;
overflow: hidden;
min-width: 78px;
font-size: 8pt;
font-weight: bold;
background: #000;
background: linear-gradient(to bottom, #002 0%, #000 20%, #000 80%, #001 100%) !important;
color: #443da0 !important;
border: 1px solid #3e3f8f;
border-bottom: 1px solid #14144f;
border-right: 1px solid #14144f;
text-align: center;
white-space: nowrap;
border-radius: 2px;
vertical-align: middle;
text-decoration: none;
padding: 4px 2px !important;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.control, .control:link, .control:visited {
overflow: hidden;
margin: 2px !important;
@@ -468,10 +446,16 @@ a.control, input.control {
white-space: nowrap;
text-decoration: none;
font-style: normal;
border: 1px solid #3e3f8f;
border-bottom: 1px solid #14144f;
border-right: 1px solid #14144f;
border-radius: 2px;
min-width: 78px;
font-size: 8pt;
font-weight: bold;
box-sizing: border-box;
min-width: 70px !important;
padding: 4px 8px !important;
padding: 5px 8px !important;
color: #443da0 !important;
background: #000 !important;
background: linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
@@ -500,7 +484,6 @@ a.control {
button.control {
box-sizing: border-box;
-moz-box-sizing: border-box;
padding: 4px !important;
}
button, input[type="submit"], input[type="reset"], .control, select {
@@ -511,7 +494,7 @@ select {
color: #443da0;
font: 8pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Lato, "Segoe UI", Verdana, Helvetica, sans-serif;
font-weight: bold;
padding: 2px 16px 2px 3px;
padding: 3px 16px 3px 3px;
background: #000;
border-radius: 2px;
cursor: pointer;
@@ -527,6 +510,10 @@ select option { /* dropdown menu reverts to normal font-weight */
font-size: 9.5pt;
}
select option:hover, select option:focus, select option:checked {
box-shadow: inset 0 0 20px 20px #652787;
}
select:focus, select:hover {
color: #652787;
border: 1px solid #652787;

100
installer/resources/themes/snark/classic/snark.css
View File

@@ -2,7 +2,7 @@
/* Author: dr|z3d */
body {
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", Verdana, "Bitstream Vera Sans", "DejaVu Sans", "Lucida Grande", Helvetica, sans-serif;
color: #0c153d;
background: #eef;
background: url(/themes/console/classic/images/bg0.png) repeat scroll center bottom #eef;
@@ -37,8 +37,8 @@ body.iframed {
text-transform: uppercase !important;
color: #000;
border: 1px solid #89f;
background: none !important;
background-image: linear-gradient(to bottom, #eef 0%, #fff 50%, #eef 50%, #fff 100%) !important;
background: #eff2ff !important;
background: linear-gradient(to bottom, #fff 0%, #fff 50%, #eff2ff 50%, #eff2ff 100%) !important;
box-shadow: 0 0 1px #fff;
}
@@ -573,6 +573,7 @@ table.snarkTorrents {
.snarkTorrentInfo td {
text-align: left !important;
vertical-align: middle !important;
}
.snarkTorrentInfo td:first-child {
@@ -646,6 +647,12 @@ table.SnarkDirInfo {
padding-right: 6px;
}
.snarkDirInfo .ParentDir a, .snarkDirInfo .snarkFileName a, .snarkTorrents .snarkTorrentName a {
display: inline-block;
width: 100%;
padding: 2px 0;
}
.snarkDirInfo .headerpriority {
text-align: center !important;
vertical-align: middle;
@@ -738,7 +745,7 @@ td {
font-size: 9pt;
padding: 1px;
opacity: 1;
color: #0c153d !important;
color: #333 !important;
}
.mainsection td {
@@ -878,16 +885,17 @@ td.snarkTorrentstatus:nth-child(2) {
text-align: center !important;
}
.snarkTorrentDownloaded {
color: #0c153d !important;
}
td.snarkTorrentDownloaded {
font-weight: bold;
width: 110px;
padding: 0 5px;
}
/*
.snarkTorrentDownloaded {
color: #0c153d !important;
}
.snarkTorrentUploaded {
color: #0c153d !important;
}
@@ -899,6 +907,7 @@ td.snarkTorrentDownloaded {
.snarkTorrentRateDown {
color: #0c153d !important;
}
*/
.snarkTorrents img {
padding: 4px 3px !important;
@@ -969,7 +978,7 @@ td[onclick^="document.location"]:hover {
.snarkTorrentOdd td,
.snarkTorrentEven td {
color: #0c153d !important;
/* color: #0c153d !important;*/
border-top: none !important;
}
@@ -1060,8 +1069,13 @@ div.percentBarInner.percentBarComplete {
}
.thumb {
transition: ease all 0.3s 0s;
}
.thumb:hover {
max-width: 96px;
max-height: 64px;
transition: ease all 0.3s 0s;
}
.snarkNewTorrent {
@@ -1069,9 +1083,10 @@ div.percentBarInner.percentBarComplete {
}
.snarkAddInfo {
font-size: 8.5pt;
font-size: 9pt;
line-height: 130% !important;
margin-left: 10px;
font-weight: normal;
}
.snarkConfigTitle,
@@ -1176,7 +1191,7 @@ a:link {
text-decoration: none;
word-wrap: break-word;
opacity: 1;
color: #006;
color: #33a;
border-radius: 0;
}
@@ -1199,7 +1214,7 @@ a:active {
}
input {
font: bold 9pt "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
font: bold 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", Verdana, "Bitstream Vera Sans", "DejaVu Sans", "Lucida Grande", Helvetica, sans-serif;
margin: 2px 4px 2px 0;
padding: 3px 4px !important;
cursor: pointer;
@@ -1242,35 +1257,42 @@ a img:focus {
filter: drop-shadow(0 0 2px #f60) !important;
}
input::-moz-focus-inner {
border: 0;
outline: 0;
}
input[type="submit"],
input[type="reset"] {
font-size: 9pt;
font-weight: normal;
color: #333;
min-width: 90px !important;
min-height: 22px;
/* opera fix */
padding: 3px 2px !important;
padding: 5px 3px !important;
text-align: center;
color: #000;
border: 1px solid #bbb;
border: 1px solid #999;
border-radius: 2px;
background: #eee;
background: linear-gradient(to bottom, #fff 0%, #ddd 100%);
box-shadow: inset 0 0 0 1px #fff;
}
input[type="submit"]:hover,
input[type="reset"]:hover {
color: #000;
input[type="submit"]:hover, input[type="reset"]:hover,
input[type="submit"]:focus, input[type="reset"]:focus {
color: #111;
background: #fff;
background: linear-gradient(to bottom, #ddd 0%, #fff 100%);
border: 1px solid #89f;
}
input[type="submit"]:active,
input[type="reset"]:active {
color: #000;
color: #333;
background: #ddd;
border: 1px solid #999;
box-shadow: inset 0 0 0 1px #fff;
box-shadow: inset 0 0 0 1px #fff, inset 3px 3px 3px #555;
}
a.control {
@@ -1318,10 +1340,10 @@ input[type="password"],
input.r,
input[name="nofilter_dataDir"],
textarea[name="i2cpOpts"] {
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif !important;
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", Verdana, "Bitstream Vera Sans", "DejaVu Sans", "Lucida Grande", Helvetica, sans-serif !important;
min-width: 160px;
margin: 2px 2px 2px 0;
padding: 3px 2px;
padding: 5px !important;
cursor: text;
vertical-align: middle;
color: #333;
@@ -1342,9 +1364,8 @@ textarea[name="i2cpOpts"]:focus {
textarea[name="i2cpOpts"],
input[name="nofilter_dataDir"] {
width: 500px;
height: 22px;
margin: 3px 0;
padding: 3px;
padding: 5px;
resize: none;
cursor: text;
}
@@ -1376,6 +1397,10 @@ img[src$="status.png"]:hover, img[src$="status.png"]:focus, img[src$="status.png
filter: invert(100%) hue-rotate(180deg) drop-shadow(0 0 2px #f60) !important;
}
img[src$="magnet.png"] {
transform: rotate(-90deg);
}
input[type=text],
input.r {
min-width: 100px;
@@ -1409,14 +1434,10 @@ input[size="85"] {
}
select {
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
}
select {
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", Verdana, "Bitstream Vera Sans", "DejaVu Sans", "Lucida Grande", Helvetica, sans-serif;
min-width: 100px;
margin: 2px 4px 2px 0;
padding: 2px 16px 2px 2px;
padding: 4px 16px 4px 2px;
cursor: pointer;
vertical-align: middle;
text-overflow: ellipsis;
@@ -1578,16 +1599,17 @@ table#trackerselect {
}
#trackerselect tr:first-child td {
padding: 2px 5px 2px 20px;
padding: 5px 10px;
border-bottom: 1px solid #89f;
}
#trackerselect td {
padding: 3px 5px 3px 20px;
padding: 3px 10px;
}
#trackerselect td:first-child {
width: 20%;
font-weight: normal;
}
#trackerselect td:nth-child(4) {
@@ -1851,7 +1873,7 @@ div.configsection a:hover {
code {
font-family: "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", Courier, mono;
font-size: 8pt;
font-size: 9pt;
font-weight: bold;
padding: 0 2px;
color: #090;
@@ -1948,3 +1970,11 @@ label.toggleview img:active, label.toggleview:active img, .snarkConfigTitle a:ac
transform: rotate(90deg);
transition: ease transform 0.3s 0s;
}
/* responsive layout */
@media screen and (min-width: 1400px) {
body, th, td, table a, input, input[type="text"], input.r, input[name="nofilter_dataDir"], select, textarea, textarea[name="i2cpOpts"] {
font-size: 10pt !important;
}
}

BIN
installer/resources/themes/snark/dark/images/delete.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 307 B

After

Width:  |  Height:  |  Size: 311 B

BIN
installer/resources/themes/snark/dark/images/remove.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 258 B

After

Width:  |  Height:  |  Size: 279 B

BIN
installer/resources/themes/snark/dark/images/start.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 256 B

After

Width:  |  Height:  |  Size: 286 B

BIN
installer/resources/themes/snark/dark/images/start_all.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 550 B

After

Width:  |  Height:  |  Size: 536 B

BIN
installer/resources/themes/snark/dark/images/stop.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 116 B

After

Width:  |  Height:  |  Size: 140 B

BIN
installer/resources/themes/snark/dark/images/stop_all.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 435 B

After

Width:  |  Height:  |  Size: 398 B

147
installer/resources/themes/snark/dark/snark.css
View File

@@ -3,16 +3,12 @@
body {
margin: 9px 8px;
color: #ee9;
font: 9pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Lato, "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
background: #000;
background: linear-gradient(45deg, rgba(0,0,0,0.5), rgba(0,34,0,0.7)), url(../../console/dark/images/camotile2.png) top left;
background-size: 3px 3px, 175px 175px;
}
tt {
font-family: "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", Courier, mono;
}
body.iframed {
background: transparent url('../../console/dark/images/transparent.gif') !important;
margin: 1px 0 !important;
@@ -28,6 +24,16 @@ body.iframed {
background: linear-gradient(to right, #000 0%, #020 50%, #000 100%);
}
::selection {
background: #030 !important;
color: white;
}
::-moz-selection {
background: #030 !important;
color: white;
}
.snarknavbar {
margin: 0 0 -6px !important;
padding: 8px 0;
@@ -245,6 +251,10 @@ body.iframed {
border-top: 0 none;
}
tt {
font-family: "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", Courier, mono;
}
.logshim {
margin-top: -10px !important;
}
@@ -407,7 +417,6 @@ tfoot tr:nth-child(n+1) {
color: #ff0;
font-family: "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", Courier, mono;
background: none;
font-weight: bold;
}
.snarkTorrents tfoot th:nth-child(3) {
@@ -438,9 +447,6 @@ table.SnarkTorrents {
.snarkTorrents td {
line-height: 110%;
text-align: left;
}
.iframed .snarkTorrents td {
font-size: 8pt !important;
}
@@ -486,7 +492,7 @@ table.SnarkTorrents {
}
.snarkTorrentInfo th:first-child {
background: url(/themes/snark/camo/images/file_sm.png) no-repeat 6px 7px, linear-gradient(to bottom, #010, #000);
background: url(images/file_sm.png) no-repeat 6px 7px, linear-gradient(to bottom, #010, #000);
}
.snarkTorrentInfo th:nth-child(2) {
@@ -587,6 +593,12 @@ table.SnarkDirInfo {
padding-right: 6px;
}
.snarkDirInfo .ParentDir a, .snarkDirInfo .snarkFileName a, .snarkTorrents .snarkTorrentName a {
display: inline-block;
width: 100%;
padding: 2px 0;
}
.snarkDirInfo .headerpriority {
text-align: center !important;
vertical-align: middle;
@@ -837,6 +849,10 @@ td.snarkTorrentDownloaded {
color: #9f9;
}
.snarkDirInfo tr:hover .snarkFileStatus img {
mix-blend-mode: normal;
}
.snarkTorrents a:hover, td[onclick^="document.location"]:hover a, .snarkDirInfo a:hover {
color: #f40 !important;
}
@@ -969,8 +985,14 @@ div.percentBarInner.percentBarComplete {
}
.thumb {
max-height: 64px;
max-width: 96px;
max-width: 16px;
transition: ease all 0.3s 0s;
}
.thumb:hover {
max-height: 80px;
max-width: 80px;
transition: ease all 0.3s 0s;
}
.snarkNewTorrent {
@@ -978,9 +1000,10 @@ div.percentBarInner.percentBarComplete {
}
.snarkAddInfo {
font-size: 8.5pt;
font-size: 9pt;
line-height: 130% !important;
margin-left: 10px;
font-weight: normal;
}
.snarkConfigTitle, label.toggleview {
@@ -1003,6 +1026,10 @@ div.percentBarInner.percentBarComplete {
box-shadow: inset 0 0 0 1px #000;
}
.snarkConfigTitle {
margin-bottom: -2px !important;
}
.snarkConfigTitle a, label.toggleview {
text-shadow: 0 0 1px #000 !important;
}
@@ -1071,6 +1098,7 @@ hr {
hr.debug {
width: 100%;
background: #131;
background: linear-gradient(to right, #131 50%, #000700);
}
hr.debug + b {
@@ -1117,7 +1145,7 @@ input {
background: #000;
color: #494;
margin: 2px 4px 2px 0;
font: bold 8pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Lato, "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
cursor: pointer;
}
@@ -1147,7 +1175,7 @@ input[type=submit], input[type=submit]:visited {
background: #000;
border: 1px outset #191;
padding: 4px 3px !important;
font: bold 8pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Lato, "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
margin-top: 6px;
min-width: 95px;
text-align: center;
@@ -1156,17 +1184,19 @@ input[type=submit], input[type=submit]:visited {
}
input[type=submit]:hover, input[type=submit]:focus {
border: 1px outset #f60;
border: 1px solid #f60;
background-color: #000;
color: #f60;
box-shadow: 0 1px 1px 0 #ee9 inset;
}
input[type=submit]:active {
border: 1px inset #f60;
border: 1px solid #f60;
background: #f60;
color: #ee9;
text-shadow: none !important;
box-shadow: inset 3px 3px 3px #000;
box-shadow: inset 0 0 0 1px #000, inset 3px 3px 3px #000;
}
input[type=submit]:disabled {
@@ -1211,7 +1241,7 @@ input[type="image"]:hover, a img:hover, input[type="image"]:focus, a:focus img {
border: 1px solid #000 !important;
border: 1px solid #151 !important;
margin: 0 2px !important;
padding: 3px !important;
padding: 4px !important;
background: #030;
background: linear-gradient(to bottom, #030 0%, #030 50%, #010 50%, #010 100%);
box-shadow: inset 0 0 0 1px #000;
@@ -1220,10 +1250,16 @@ input[type="image"]:hover, a img:hover, input[type="image"]:focus, a:focus img {
filter: drop-shadow(0 0 1px #000);
}
.snarkTorrents th:last-child input[type="image"]:hover, .snarkTorrents td:last-child input[type="image"]:hover { /* borders on hover only for torrent control buttons, otherwise drop-shadow */
.snarkTorrents th:last-child input[type="image"]:hover, .snarkTorrents td:last-child input[type="image"]:hover,
.snarkTorrents th:last-child input[type="image"]:focus, .snarkTorrents td:last-child input[type="image"]:focus { /* borders on hover only for torrent control buttons, otherwise drop-shadow */
border: 1px solid #f60 !important;
}
.snarkTorrents th:last-child input[type="image"]:active, .snarkTorrents td:last-child input[type="image"]:active {
box-shadow: inset 3px 3px 3px #000;
background-blend-mode: luminosity;
}
input[type=text], input.r, textarea[name="i2cpOpts"], input[name="nofilter_dataDir"] {
color: #bb7;
padding: 4px 3px !important;
@@ -1308,7 +1344,7 @@ input[size="85"] {
select {
background: #000 !important;
color: #494;
font: 8pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Lato, "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
font: 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
font-weight: bold;
padding: 2px 16px 2px 2px;
border-radius: 2px;
@@ -1324,6 +1360,10 @@ select option { /* dropdown menu reverts to normal font-weight */
font-size: 9.5pt;
}
select option:hover, select option:checked {
box-shadow: inset 0 0 20px 20px #f60;
}
select:hover, select:focus {
background: #000 !important;
color: #f60 !important;
@@ -1387,41 +1427,10 @@ img:hover {
line-height: 100%;
}
img.thumb { /* consistent size for thumbnail images in file manifest */
width: 16px;
border-radius: 1px;
}
img[src$="magnet.png"] {
transform: rotate(-90deg);
}
/*
img[src$="folder.png"] {
filter: hue-rotate(60deg);
}
img[src$="folder.png"]:hover {
filter: hue-rotate(60deg) drop-shadow(0 0 1px #f90) !important;
}
.infoz {
margin: 0 -1px 0 0 !important;
padding: 0 !important;
line-height: 100%;
float: left;
}
.infoz img {
border: none;
opacity: 1 !important;
}
.infoz img:hover {
opacity: 1 !important;
}
*/
#pagenav img.disable, #pagenav img.disable:hover {
opacity: 0.3;
margin: 0 2px !important;
@@ -1485,6 +1494,7 @@ table#trackerselect {
#trackerselect td:first-child {
width: 20%;
font-weight: normal;
}
#trackerselect td:nth-child(4) {
@@ -1717,14 +1727,14 @@ table.trackerconfig td:first-child {
}
code {
font-size: 8pt;
font-size: 8.5pt;
color: #ff6;
padding: 0 2px;
font-weight: bold;
font-family: "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", Courier, mono;
}
.iframed .snarknavbar, .iframed .mainsection, .iframed .addtorrentsection, .iframed .newtorrentsection, .iframed .configsection, .iframed .configsectionpanel {
.iframed .snarknavbar, .iframed .mainsection, .iframed .addtorrentsection,
.iframed .newtorrentsection, .iframed .configsection, .iframed .configsectionpanel {
border-left: none !important;
border-right: none !important;
border-radius: 0;
@@ -1796,3 +1806,32 @@ input#toggle_addtorrent:checked + label + hr + table, input#toggle_createtorrent
label.toggleview, .snarkConfigTitle a:visited {
color: #7c7;
}
/* responsive layout */
@media screen and (min-width: 1400px) {
body, .snarkTorrents td, .snarkAddInfo, th, td {
font-size: 10pt !important;
}
.snarkRefresh:link {
font-size: 10.5pt;
}
.snarkRefresh:link:first-child {
padding-left: 13px !important;
}
tt, .snarkTorrents tt, code, .snarkMessages, input, input[type="submit"], input[type="reset"], select, button, textarea {
font-size: 9pt;
}
select {
padding-top: 4px;
padding-bottom: 4px;
}
select:nth-child(2) {
margin-left: -14px;
}
}

290
installer/resources/themes/snark/light/snark.css
View File

@@ -4,10 +4,9 @@
body {
color: #272e3f;
font: 8pt "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
background: #a4a4cb url(/themes/console/light/images/tile2.png) center top;
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
background: #a4a4cb url(/themes/console/light/images/tile2.png) center top fixed;
background-size: 32px 32px;
font-size-adjust: 0.58;
margin: 5px;
}
@@ -75,6 +74,10 @@ button::-moz-focus-inner, input::-moz-focus-inner {
box-shadow: none;
}
.snarkRefresh img {
display: none;
}
.snarkRefresh:link,.snarkRefresh:visited {
text-decoration: none !important;
text-transform: uppercase !important;
@@ -116,9 +119,10 @@ button::-moz-focus-inner, input::-moz-focus-inner {
}
.snarkRefresh:first-child {
padding: 4px 10px 4px 19px !important;
border-radius: 2px 0 0 2px;
padding-left: 16px !important;
background: linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 51%, #eef 100%);
background: url(images/button_snark.png) 10px center no-repeat, linear-gradient(to bottom, #fff 0%, #fff 50%, #eef 51%, #eef 100%);
}
.snarkRefresh:first-child:hover, .snarkRefresh:first-child:focus {
@@ -162,7 +166,8 @@ button::-moz-focus-inner, input::-moz-focus-inner {
}
.snarkMessages {
font: normal 8pt "DejaVu Sans Mono", "Droid Sans Mono", "Lucida Console", "Andale Mono", Courier, mono !important;
font-family: "Droid Sans Mono", "Lucida Console", "DejaVu Sans Mono", Courier, mono;
font-size: 8pt;
text-align: left;
margin: -2px 0 0;
padding: 3px 5px 3px 5px;
@@ -177,11 +182,12 @@ button::-moz-focus-inner, input::-moz-focus-inner {
border-top: 1px solid #7778bf;
border-bottom: 1px solid #7778bf;
box-shadow: inset 0 0 1px #fff;
background-size: 50px 60px, 100% 100%;
background-size: auto 100%, 100% 100%;
}
.snarkMessages a:link, .snarkMessages a:visited {
color: #505 !important;
font-size: 8pt;
}
.snarkMessages a:hover {
@@ -196,6 +202,7 @@ button::-moz-focus-inner, input::-moz-focus-inner {
.snarkMessages li {
margin-left: -15px;
line-height: 120%;
}
.snarkMessages li::before {
@@ -238,9 +245,49 @@ button::-moz-focus-inner, input::-moz-focus-inner {
margin-top: 11px !important;
}
a:link {
color: #359;
text-decoration: none;
font-weight: normal;
word-wrap: break-word;
font-size: 9pt;
}
a:visited {
color: #218;
text-decoration: none;
}
a:hover, a:focus {
color: #f60;
}
a:active {
color: #6f072b;
}
a.control, a.controld {
background: #fff;
border-radius: 2px;
font-weight: bold;
margin: 5px 4px !important;
padding: 5px !important;
white-space: nowrap;
display: inline-block;
float: right;
min-width: 0 !important;
}
a.controld {
color: #459;
font-weight: normal;
display: none;
}
pre {
width: 100%;
font: 8pt "Lucida Console","DejaVu Sans Mono",Courier,mono !important;
font: 8pt "Droid Sans Mono", "Lucida Console", "DejaVu Sans Mono", Courier, mono;
padding: 0;
text-align: left !important;
height: 8px;
@@ -285,7 +332,7 @@ thead {
th {
padding: 3px 2px;
font-size: 8pt;
font-size: 9pt;
border-top: 1px solid #7778bf;
border-bottom: 1px solid #7778bf;
background: #fff url("../../console/light/images/header.png") repeat-x scroll center center;
@@ -396,12 +443,16 @@ tfoot tr:nth-child(n+1) {
text-align: right !important;
}
.snarkTorrents thead th:nth-child(6), .snarkTorrents thead th:nth-child(7) {
text-align: center !important;
}
.snarkTorrents td {
line-height: 110%;
}
.snarkTorrents td:nth-child(1) {
width: 20px !important;
max-width: 20px !important;
text-align: left;
padding: 2px;
}
@@ -448,7 +499,7 @@ td {
padding: 2px 4px;
color: #272e3f !important;
opacity: 1;
font-size: 8pt;
font-size: 9pt;
}
.mainsection td {
@@ -457,7 +508,6 @@ td {
td:first-child {
text-align: right;
font-size: 8pt;
}
.center {
@@ -510,8 +560,9 @@ td:first-child {
}
.snarkTorrentAction input[type="image"]:active, .snarkTorrents th:last-child input[type="image"]:active {
filter: hue-rotate(290deg) invert(100%) !important;
-webkit-filter: hue-rotate(290deg) invert(100%) !important;
box-shadow: inset 3px 3px 3px #333;
filter: hue-rotate(110deg) !important;
-webkit-filter: hue-rotate(110deg) !important;
}
.snarkTorrentEven {
@@ -560,7 +611,6 @@ td:first-child {
}
.snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded {
font-size: 8pt;
padding: 0 3px;
line-height: 90%;
}
@@ -570,20 +620,6 @@ td:first-child {
text-align: center;
}
/*
.snarkTorrentUploaded {
color: #001 !important;
}
.snarkTorrentRateUp {
color: #001 !important;
}
.snarkTorrentRateDown {
color: #001 !important;
}
*/
.snarkTorrentOdd {
background: #e0e0ff;
font-size: 8pt;
@@ -632,7 +668,6 @@ td:first-child {
.snarkFileStatus {
padding: 4px 5px 4px 15px;
font-style: italic;
font-size: 8pt;
text-align: left;
min-width: 230px;
}
@@ -650,8 +685,14 @@ td:first-child {
}
.thumb {
max-height: 64px;
max-width: 96px;
max-width: 16px;
transition: ease all 0.3s 0s;
}
.thumb:hover {
max-height: 80px;
max-width: 80px;
transition: ease all 0.3s 0s;
}
.snarkNewTorrent {
@@ -659,12 +700,12 @@ td:first-child {
}
.snarkAddInfo {
font-size: 8pt;
font-size: 9pt;
line-height: 130% !important;
}
.snarkConfigTitle, label.toggleview {
font-size: 10.5pt;
font-size: 11pt;
font-weight: bold;
padding: 2px 15px 2px 15px;
margin: 0 0 -3px 0 !important;
@@ -680,18 +721,17 @@ td:first-child {
color: #559;
}
.snarkConfigTitle a {
font-size: 11pt !important;
}
.snarkConfigTitle img:hover { /* inert titles */
color: #40404f;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
.snarkRefresh:link {
padding-top: 6px !important;
}
.snarkConfigTitle, label.toggleview {
font-size: 12pt;
.snarkConfigTitle a, label.toggleview {
font-size: 14pt !important;
padding: 1px 15px 4px;
}
}
@@ -787,6 +827,12 @@ td:first-child {
min-width: 0 !important;
}
.snarkDirInfo .ParentDir a, .snarkDirInfo .snarkFileName a, .snarkTorrents .snarkTorrentName a {
display: inline-block;
width: 100%;
padding: 2px 0;
}
table#trackerselect {
width: 100% !important;
border-collapse: separate;
@@ -807,15 +853,26 @@ table#trackerselect {
box-shadow: inset 0 0 0 1px #fff;
filter: drop-shadow(0 0 1px #999);
-webkit-filter: drop-shadow(0 0 1px #ccc);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
#trackerselect td {
padding: 2px;
}
#trackerselect td:first-child {
width: 150px !important;
width: 100px !important;
white-space: nowrap;
}
#trackerselect td:nth-child(2), #trackerselect td:nth-child(3) {
max-width: 50px !important;
}
#trackerselect td:last-child {
overflow: hidden;
text-overflow: ellispis;
}
form {
@@ -846,44 +903,6 @@ hr.debug:nth-child(n+7) {
background: #339;
}
a:link {
color: #359;
text-decoration: none;
font-weight: normal;
word-wrap: break-word;
}
a:visited {
color: #218;
text-decoration: none;
}
a:hover, a:focus {
color: #f60;
}
a:active {
color: #6f072b;
}
a.control, a.controld {
background: #fff;
border-radius: 2px;
font-weight: bold;
margin: 5px 4px !important;
padding: 5px !important;
white-space: nowrap;
display: inline-block;
float: right;
min-width: 0 !important;
}
a.controld {
color: #459;
font-weight: normal;
display: none;
}
.headerpriority br {
display: none;
}
@@ -902,7 +921,7 @@ input {
background: #fff;
color: #272e3f;
margin: 2px 4px 2px 0;
font: bold 8pt "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
box-shadow: inset 0 0 1px #fff, 0 0 1px #999;
}
@@ -918,7 +937,7 @@ input[type=submit], a.control {
background: linear-gradient(to bottom, #fff 0%, #fff 50%, #ddf 50%, #ddf 100%);
border: 1px solid #7778bf;
padding: 2px;
font: bold 8pt "Droid Sans", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
margin: 6px 10px 6px 0;
border-radius: 2px;
min-width: 90px;
@@ -1015,7 +1034,7 @@ input.disabled, input.disabled:hover, a.controld {
select {
background: #eef url(images/dropdown.png) right center no-repeat !important;
font: 8pt "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
font: 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
font-weight: bold;
padding: 5px 16px 5px 3px !important;
border-radius: 2px;
@@ -1083,26 +1102,6 @@ img[src$="details.png"] {
mix-blend-mode: luminosity;
}
img.thumb {
width: 16px;
}
.infoz {
margin: 0 -1px 0 0 !important;
padding: 0 !important;
line-height: 100%;
float: left;
}
.infoz img {
border: none;
opacity: 1 !important;
}
.infoz img:hover {
opacity: 1 !important;
}
.newtorrentsection td:first-child, .addtorrentsection td:first-child, .configsectionpanel td:first-child {
width: auto !important;
}
@@ -1238,10 +1237,10 @@ form:last-child .configsectionpanel {
}
code, tt {
font-size: 8pt;
font-size: 8.5pt;
color: #0045ff;
font-weight: bold;
font-family: "DejaVu Sans Mono", "Droid Sans Mono", Courier, mono;
font-family: "Droid Sans Mono", "Lucida Console", "DejaVu Sans Mono", Courier, mono;
}
.routerdown {
@@ -1325,3 +1324,84 @@ input#toggle_addtorrent:checked + label + hr + table, input#toggle_createtorrent
.iframed input#toggle_addtorrent:checked + label + hr + table, .iframed input#toggle_createtorrent:checked + label + hr + table {
display: none;
}
/*responsive layout */
@media screen and (max-width: 1000px) {
body, td, .snarkMessages li, .snarkMessages a, button, input, select, .snarkAddInfo, code, tt, th, a, a:link, .snarkAddInfo, .snarkFileStatus {
font-size: 8pt !important;
}
.snarkConfigTitle a {
font-size: 10.5pt !important;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
.snarkConfigTitle a, label.toggleview {
font-size: 12pt !important;
}
}
}
/* enable to hide status text, upload speed + upload amount in main torrent table at 800px or less */
/*
@media screen and (max-width: 800px) {
.snarkTorrents th:nth-child(2), .snarkTorrents td:nth-child(2),
.snarkTorrents th:nth-child(7), .snarkTorrents tfoot th:nth-child(3), .snarkTorrents td.snarkTorrentUploaded,
.snarkTorrents th:nth-child(9), .snarkTorrents tfoot th:nth-child(5), .snarkTorrents td.snarkTorrentRateUp {
max-width: 0 !important;
overflow: hidden;
white-space: nowrap;
font-size: 0 !important;
padding: 0 !important;
}
.snarkTorrents th:nth-child(7) img {
display: none;
}
}
*/
@media screen and (min-width: 1400px) {
body, td, button, input, select, .snarkAddInfo, code, tt, th, a, a:link {
font-size: 10pt !important;
}
.snarkMessages li, .snarkMessages a {
font-size: 9pt !important;
line-height: 130%;
}
a.snarkRefresh {
font-size: 11pt !important;
}
a.snarkRefresh:first-child {
padding-left: 16px !important;
}
.snarkConfigTitle a, label.toggleview {
font-size: 12pt !important;
padding: 1px 15px 4px;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
.snarkConfigTitle a, label.toggleview {
font-size: 15pt !important;
padding: 1px 15px 4px;
}
}
input[type="submit"] {
min-width: 100px;
}
.snarkMessages {
height: 60px;
}
.snarkConfigTitle, label.toggleview {
font-size: 12pt;
padding: 3px 15px;
}
}

BIN
installer/resources/themes/snark/midnight/images/delete.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 314 B

After

Width:  |  Height:  |  Size: 348 B

BIN
installer/resources/themes/snark/midnight/images/remove.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 278 B

After

Width:  |  Height:  |  Size: 303 B

BIN
installer/resources/themes/snark/midnight/images/start.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 279 B

After

Width:  |  Height:  |  Size: 312 B

BIN
installer/resources/themes/snark/midnight/images/start_all.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 585 B

After

Width:  |  Height:  |  Size: 581 B

BIN
installer/resources/themes/snark/midnight/images/stop.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 115 B

After

Width:  |  Height:  |  Size: 140 B

BIN
installer/resources/themes/snark/midnight/images/stop_all.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 443 B

After

Width:  |  Height:  |  Size: 410 B

228
installer/resources/themes/snark/midnight/snark.css
View File

@@ -1,7 +1,8 @@
/* I2PSnark theme "Midnight" by dr|z3d */
/* I2PSnark theme "Midnight" */
/* Author: dr|z3d */
body {
font: 9pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "DejaVu Sans", "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
color: #c9ceff;
background: #000;
margin: 7px 6px;
@@ -9,7 +10,7 @@ body {
body.iframed {
margin: 1px 0 !important;
background: transparent url(../../console/dark/images/transparent.gif) !important;
background: transparent url(/themes/console/images/transparent.gif) !important;
}
* {
@@ -160,16 +161,6 @@ code {
text-shadow: none;
}
/*
.snarkRefresh:active:first-child {
background: #000 !important;
background-image: url(images/button_tracker_hover.png), linear-gradient(to bottom, #510 0%, #530 50%, #000 51%, #000 100%) !important;
background-position: 7px center, center center !important;
background-repeat: no-repeat, repeat !important;
}
*/
.snarkRefresh:link:last-of-type {
border-radius: 2px !important;
}
@@ -485,16 +476,18 @@ tfoot tr:nth-child(n+1) {
width: 24px !important;
}
.snarkTorrents td:nth-child(3),
.SnarkTorrents td:nth-child(4) {
.snarkTorrents td:nth-child(3) {
width: 16px !important;
padding: 0 !important;
text-align: right !important;
}
.SnarkTorrents td:nth-child(4) {
width: 16px !important;
padding: 0 2px 0 0 !important;
text-align: center !important;
}
.snarkTorrents td:nth-child(3) {
text-align: right !important;
}
.snarkTorrents td[colspan="10"] {
padding: 2px;
@@ -534,6 +527,7 @@ tfoot tr:nth-child(n+1) {
.snarkTorrentInfo th:first-child {
background: url(images/file.png) no-repeat 6px center, linear-gradient(to bottom, #010011, #000);
background-size: 14px;
background-blend-mode: luminosity;
}
.snarkTorrentInfo th:nth-child(2) {
@@ -618,6 +612,12 @@ tfoot tr:nth-child(n+1) {
padding-right: 6px;
}
.snarkDirInfo .ParentDir a, .snarkDirInfo .snarkFileName a, .snarkTorrents .snarkTorrentName a {
display: inline-block;
width: 100%;
padding: 2px 0;
}
.snarkDirInfo .headerpriority {
text-align: center !important;
vertical-align: middle;
@@ -744,7 +744,7 @@ td:first-child {
.snarkTorrentAction {
width: 60px;
margin: 0 !important;
padding: 1px 1px 1px 1px !important;
padding: 1px !important;
text-align: center !important;
}
@@ -853,6 +853,10 @@ td.snarkTorrentDownloaded {
color: #c9ceff !important;
}
.snarkDirInfo tr:hover .snarkFileStatus img {
mix-blend-mode: normal;
}
.ParentDir a, .ParentDir a:visited, .ParentDir:hover a {
color: #7972d1 !important;
}
@@ -994,7 +998,14 @@ div.percentBarInner.percentBarComplete {
}
.thumb {
width: 16px;
max-width: 16px;
transition: ease all 0.3s 0s;
}
.thumb:hover {
max-width: 96px;
max-height: 64px;
transition: ease all 0.3s 0s;
}
.snarkNewTorrent {
@@ -1029,6 +1040,10 @@ label.toggleview {
margin-bottom: -7px;
}
.configsectionpanel .snarkConfigTitle {
padding-bottom: 4px;
}
.snarkConfigTitle a, .snarkConfigTitle a:visited {
color: #89f !important;
}
@@ -1112,7 +1127,7 @@ a:visited {
color: #362e9e;
}
a:hover {
a:hover, a:focus {
color: #652787;
}
@@ -1121,7 +1136,7 @@ a:active {
}
input {
font: bold 8pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Lato, "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
font: bold 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
margin: 2px 4px 2px 0;
padding: 3px 4px !important;
cursor: pointer;
@@ -1132,12 +1147,6 @@ input {
background: #001;
}
input[type="submit"],
input[type="reset"] {
filter: drop-shadow(0 0 1px #000);
-webkit-filter: drop-shadow(0 0 1px #000);
}
input:disabled {
cursor: auto;
opacity: .5 !important;
@@ -1155,33 +1164,52 @@ input.r {
background: #001;
}
input[type=submit],
input[type=submit]:visited {
font: bold 8pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Lato, "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
min-width: 95px;
input[type="submit"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner {
border: none;
outline: none;
}
input[type="submit"], input[type="reset"] {
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
min-width: 95px !important;
margin-top: 6px;
padding: 2px;
padding: 5px !important;
text-align: center;
color: #443da0;
border: 1px solid #3e3f8f;
border-bottom-color: #14144f;
border-right-color: #14144f;
background: #000;
background: linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
box-shadow: inset 0 0 0 1px #000;
filter: drop-shadow(0 0 1px #000);
-webkit-filter: drop-shadow(0 0 1px #000);
}
input[type=submit]:hover,
input[type=submit]:focus {
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
input[type="submit"],
input[type="reset"] {
padding: 5px !important;
}
}
*/
input[type="submit"]:hover, input[type="submit"]:focus,
input[type="reset"]:hover, input[type="reset"]:focus {
color: #652787;
border: 1px solid #652787 !important;
background-color: #000;
background: #000 !important;
box-shadow: 0 1px 1px 0 #c9ceff inset;
}
input[type=submit]:active {
input[type="submit"]:active,
input[type="reset"]:active {
color: #c9ceff;
border: 1px inset #652787;
background: #652787;
text-shadow: none !important;
background: #652787 !important;
box-shadow: inset 3px 3px 3px #000;
}
input[type=submit]:disabled {
@@ -1210,14 +1238,14 @@ input[type="checkbox"],
.optbox,
input[type="radio"] {
min-width: 16px !important;
min-height: 16px !important;
filter: invert(100%) sepia(100%) hue-rotate(200deg) saturate(200%); /* colorize radios and checkboxes */
-webkit-filter: invert(100%) sepia(100%) hue-rotate(200deg) saturate(200%);
}
input[type="checkbox"]:hover,
.optbox:hover,
input[type="radio"]:hover {
filter: invert(100%) sepia(100%) hue-rotate(200deg) saturate(200%) drop-shadow(0 0 1px #652787);
input[type="checkbox"]:hover, .optbox:hover, input[type="radio"]:hover,
input[type="checkbox"]:focus, .optbox:focus, input[type="radio"]:focus {
filter: invert(100%) sepia(100%) hue-rotate(200deg) saturate(200%) drop-shadow(0 0 2px #652787);
}
.snarkTorrents th:last-child,
@@ -1226,7 +1254,7 @@ input[type="radio"]:hover {
}
.snarkTorrents td:last-child {
padding: 1px 2px !important;
padding: 4px 2px !important;
}
.snarkTorrents th:last-child input[type="image"],
@@ -1235,7 +1263,7 @@ input[type="radio"]:hover {
border: 1px solid #443da0 !important;
border: 1px solid #171c3f !important;
box-shadow: inset 0 0 0 1px #000;
padding: 3px !important;
padding: 4px !important;
border-radius: 2px;
text-align: center;
mix-blend-mode: normal;
@@ -1256,7 +1284,7 @@ input[type="radio"]:hover {
.snarkTorrents th:last-child input[type="image"]:focus,
.snarkTorrents td:last-child input[type="image"]:hover,
.snarkTorrents td:last-child input[type="image"]:focus {
/* borders on hover only for torrent control buttons, otherwise drop-shadow */
/* borders on hover only for torrent control buttons, otherwise drop-shadow */
border: 1px solid #652787 !important;
}
@@ -1270,13 +1298,12 @@ input.r:hover {
cursor: text;
}
input[type=text]:focus,
textarea:focus,
input.r:focus,
textarea[name="i2cpOpts"]:focus,
input[name="nofilter_dataDir"]:focus {
input[type=text]:focus, textarea:focus, input.r:focus, textarea[name="i2cpOpts"]:focus, input[name="nofilter_dataDir"]:focus {
color: #7166ff;
background: #000;
filter: drop-shadow(0px 0 1px #99f);
-webkit-filter: drop-shadow(0px 0 1px #99f);
transition: ease all 0.3s 0s;
}
textarea[name="i2cpOpts"],
@@ -1285,6 +1312,7 @@ input[name="nofilter_dataDir"] {
margin: 3px 0;
padding: 4px !important;
cursor: text;
resize: none;
}
thead img,
@@ -1332,11 +1360,11 @@ input[size="85"] {
}
select {
font: 8pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "DejaVu Sans", Lato, "Segoe UI", Verdana, Tahoma, "Lucida Grande", Helvetica, sans-serif;
font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "DejaVu Sans", "Segoe UI", Verdana, "Lucida Grande", "Lucida Grande", Helvetica, sans-serif;
font-weight: bold;
min-width: 100px;
margin: 2px 4px 2px 0;
padding: 2px 16px 2px 2px;
padding: 3px 16px 3px 2px;
cursor: pointer;
text-overflow: ellipsis;
color: #443da0;
@@ -1347,12 +1375,6 @@ select {
background: #000 !important;
}
select option {
font-size: 9.5pt;
/* dropdown menu reverts to normal font-weight */
font-weight: normal;
}
select:hover,
select:focus {
color: #652787 !important;
@@ -1364,25 +1386,31 @@ select:hover {
box-shadow: inset 0 1px 1px 0 #c9ceff;
}
select option {
font-size: 9.5pt;
/* dropdown menu reverts to normal font-weight */
font-weight: normal;
}
select option:hover, select option:checked {
box-shadow: inset 20px 20px #652787;
}
/* target firefox and derivatives only */
@-moz-document url-prefix() {
/* target firefox and derivatives only */
select
{
background: #000 url(images/dropdown.png) right center no-repeat !important;
-moz-appearance: none;
}
select:hover,
select:focus,
select:active
{
background: #000 url(images/dropdown_hover.png) right center no-repeat !important;
}
select {
background: #000 url(images/dropdown.png) right center no-repeat !important;
-moz-appearance: none;
}
select:hover, select:focus, select:active {
background: #000 url(images/dropdown_hover.png) right center no-repeat !important;
}
}
select:nth-child(2) {
margin-left: -18px;
margin-left: -16px;
}
textarea {
@@ -1428,7 +1456,7 @@ img[src$="details.png"] {
}
img.thumb {
width: 16px;
max-width: 16px;
}
.snarkFileStatus img {
@@ -1439,24 +1467,6 @@ img.thumb {
mix-blend-mode: normal !important;
}
/*
.infoz {
line-height: 100%;
float: left;
margin: 0 -1px 0 0 !important;
padding: 0 !important;
}
.infoz img {
opacity: 1 !important;
border: none;
}
.infoz img:hover {
opacity: 1 !important;
}
*/
#pagenav img.disable,
#pagenav img.disable:hover {
opacity: .3;
@@ -1542,6 +1552,7 @@ img.thumb {
#trackerselect td:first-child {
width: 20%;
font-weight: normal;
}
#trackerselect td:nth-child(4) {
@@ -1894,3 +1905,36 @@ label.toggleview,
.snarkConfigTitle a:visited {
color: #89f;
}
/* responsive layout */
@media screen and (min-width: 1400px) {
code, textarea, .snarkMessages li, input {
font-size: 9pt !important;
}
thead th, tfoot th, td, select, select option, .snarkAddInfo {
font-size: 10pt !important;
}
.snarkRefresh {
font-size: 10.5pt !important;
}
.snarkConfigTitle, .toggleview {
font-size: 12.5pt !important;
padding: 4px 25px 5px 22px;
}
.snarkConfigTitle {
padding: 2px 25px 3px 22px
}
.snarkMessages {
height: 54px;
}
select:nth-child(2) {
margin-left: -14px !important;
}
}

148
installer/resources/themes/snark/ubergine/snark.css
View File

@@ -1,5 +1,6 @@
/* I2PSnark theme "Ubergine" by dr|z3d */
/* I2PSnark theme "Ubergine" */
/* Guantanamo Commemorative Edition. */
/* Author: dr|z3d */
html {
min-height: 100%;
@@ -10,11 +11,11 @@ body {
background: linear-gradient(to bottom, rgba(64,0,64,0.2), rgba(11,0,11,0.1), rgba(11,0,11,0.2)), url(images/graytile.png) #26092f;
background-size: 100% 100%, 96px 96px;
color: #fff;
font: 8pt "Bitstream Vera Sans", "Noto Sans", Verdana, Ubuntu, Tahoma, Helvetica, sans-serif;
font: 8pt "Bitstream Vera Sans", Verdana, "Noto Sans", Ubuntu, Helvetica, sans-serif;
}
body.iframed {
background: transparent url('../../console/dark/images/transparent.gif') !important;
background: transparent url(themes/console/images/transparent.gif) !important;
margin: 0 !important;
}
@@ -182,7 +183,7 @@ body.iframed {
width: calc(100% - 12px);
background: #2a192a url(images/hat.png) no-repeat scroll right center;
background: url(images/hat.png) no-repeat scroll right center, linear-gradient(to bottom, #2a192a 0%, #202 100%);
background-size: 80px 83px;
background-size: 80px 83px, 100% 100%;
box-shadow: inset 0 0 3px 1px rgba(16, 0, 16, 0.6);
outline: none;
filter: drop-shadow(0 0 1px rgba(16, 8, 16, 0.5));
@@ -664,7 +665,12 @@ table.snarkTorrents tbody tr:hover .snarkTorrentName, table.snarkDirInfo tbody t
.snarkFileIcon {
width: 16px;
text-align: center;
padding-left: 3px;
padding: 4px !important;
}
.snarkFileIcon img {
margin: 1px;
padding: 0;
}
.snarkFileName {
@@ -787,6 +793,12 @@ table.SnarkDirInfo {
opacity: 1;
}
.snarkDirInfo .ParentDir a, .snarkDirInfo .snarkFileName a, .snarkTorrents .snarkTorrentName a {
display: inline-block;
width: 100%;
padding: 2px 0;
}
.snarkDirInfo .headerpriority {
text-align: right !important;
vertical-align: middle;
@@ -809,8 +821,14 @@ table.SnarkDirInfo {
}
.thumb {
max-height: 64px;
max-width: 96px;
max-width: 16px;
transition: ease-out all 0.3s 0s;
}
.thumb:hover {
max-width: 80px;
max-height: 80px;
transition: ease all 0.3s 0s;
}
div.snarkNewTorrent {
@@ -865,6 +883,12 @@ table#trackerselect {
min-width: 200px;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
.snarkConfigTitle, label.toggleview {
font-size: 12pt;
}
}
.snarkConfigTitle img, label.toggleview img {
margin-right: -3px;
margin-bottom: 1px;
@@ -943,7 +967,6 @@ a.control, a.controld, a.control:active {
padding: 4px 6px 4px 4px;
text-shadow: 0 0 #410;
white-space: nowrap;
min-height: 22px;
filter: drop-shadow(0 0 1px #313) !important;
-webkit-filter: drop-shadow(0 0 1px #313) !important;
}
@@ -970,9 +993,14 @@ a.controld img {
display: none;
}
a.control, input[type="submit"], input[type="reset"] {
background-size: 14px 14px, 100% 100% !important;
}
a.control:active, input[type="submit"]:active, input[type="reset"]:active {
color: #ce1641 !important;
border: 1px solid #fff !important;
box-shadow: inset 3px 3px 3px #fff;
}
.snarkDirInfo tr:last-child {
@@ -995,7 +1023,7 @@ th.headerstatus {
*/
input, a.control {
font: 8pt "Droid Sans", "Bitstream Vera Sans", Verdana, Tahoma, Helvetica, sans-serif;
font: 8pt "Droid Sans", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
font-weight: bold;
}
@@ -1014,7 +1042,7 @@ input {
input.r {
text-align: right;
background: url(images/graytile.png);
font-family: "Bitstream Vera Sans", Verdana, Tahoma, Helvetica, sans-serif;
font-family: "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
}
input[type=submit] {
@@ -1151,7 +1179,7 @@ input[type="submit"]:disabled:active, a.control:disabled:active {
input[type="text"], input.r, input[name="nofilter_dataDir"] {
padding: 4px !important;
font-family: "Bitstream Vera Sans", Verdana, Tahoma, Helvetica, sans-serif;
font-family: "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
box-shadow: inset 1px 1px 2px 1px #101;
letter-spacing: 0.03em;
background: url(images/graytile.png) #212;
@@ -1209,111 +1237,108 @@ input.disabled, input.disabled:hover, input.disabled:active, a.control.disabled:
}
input.accept, input.accept:active {
background: #989 url(images/accept.png) no-repeat 2px center;
background: url(images/accept.png) no-repeat 2px center, linear-gradient(to bottom, #989 0%, #878 100%);
background: #989 url(images/accept.png) no-repeat 4px center;
background: url(images/accept.png) no-repeat 4px center, linear-gradient(to bottom, #989 0%, #878 100%);
padding: 4px 3px 4px 18px !important;
min-height: 22px;
}
input.accept:hover, input.accept:focus {
background: #767 url(images/accept.png) no-repeat 2px center;
background: url(images/accept.png) no-repeat 2px center, linear-gradient(to bottom, #767 0%, #989 100%);
background: #767 url(images/accept.png) no-repeat 4px center;
background: url(images/accept.png) no-repeat 4px center, linear-gradient(to bottom, #767 0%, #989 100%);
}
input.add, input.add:active {
background: #989 url(images/add.png) no-repeat 2px center;
background: url(images/add.png) no-repeat 2px center, linear-gradient(to bottom, #989 0%, #878 100%);
background: #989 url(images/add.png) no-repeat 4px center;
background: url(images/add.png) no-repeat 4px center, linear-gradient(to bottom, #989 0%, #878 100%);
padding: 4px 3px 4px 18px !important;
min-height: 22px;
}
input.add:hover, input.add:focus {
background: #767 url(images/add.png) no-repeat 2px center;
background: url(images/add.png) no-repeat 2px center, linear-gradient(to bottom, #767 0%, #989 100%);
background: #767 url(images/add.png) no-repeat 4px center;
background: url(images/add.png) no-repeat 4px center, linear-gradient(to bottom, #767 0%, #989 100%);
}
input.cancel, input.cancel:active {
background: #989 url(images/cancel.png) no-repeat 2px center;
background: url(images/cancel.png) no-repeat 2px center, linear-gradient(to bottom, #989 0%, #878 100%);
background: #989 url(images/cancel.png) no-repeat 4px center;
background: url(images/cancel.png) no-repeat 4px center, linear-gradient(to bottom, #989 0%, #878 100%);
padding: 4px 3px 4px 18px !important;
min-height: 22px;
}
input.cancel:hover, input.cancel:focus {
background: #767 url(images/cancel.png) no-repeat 2px center;
background: url(images/cancel.png) no-repeat 2px center, linear-gradient(to bottom, #767 0%, #989 100%);
background: #767 url(images/cancel.png) no-repeat 4px center;
background: url(images/cancel.png) no-repeat 4px center, linear-gradient(to bottom, #767 0%, #989 100%);
}
input.create, input.create:active {
background: #989 url(images/create.png) no-repeat 2px center;
background: url(images/create.png) no-repeat 2px center, linear-gradient(to bottom, #989 0%, #878 100%);
background: #989 url(images/create.png) no-repeat 4px center;
background: url(images/create.png) no-repeat 4px center, linear-gradient(to bottom, #989 0%, #878 100%);
padding: 4px 3px 4px 18px !important;
min-height: 22px;
}
input.create:hover, input.create:focus {
background: #767 url(images/create.png) no-repeat 2px center;
background: url(images/create.png) no-repeat 2px center, linear-gradient(to bottom, #767 0%, #989 100%);
background: #767 url(images/create.png) no-repeat 4px center;
background: url(images/create.png) no-repeat 4px center, linear-gradient(to bottom, #767 0%, #989 100%);
}
input.delete, input.delete:active {
background: #989 url(images/nuke.png) no-repeat 2px center;
background: url(images/nuke.png) no-repeat 2px center, linear-gradient(to bottom, #989 0%, #878 100%);
background: #989 url(images/nuke.png) no-repeat 4px center;
background: url(images/nuke.png) no-repeat 4px center, linear-gradient(to bottom, #989 0%, #878 100%);
padding: 4px 3px 4px 18px !important;
min-height: 22px;
}
input.delete:hover, input.delete:focus {
background: #767 url(images/nuke.png) no-repeat 2px center;
background: url(images/nuke.png) no-repeat 2px center, linear-gradient(to bottom, #767 0%, #989 100%);
background: #767 url(images/nuke.png) no-repeat 4px center;
background: url(images/nuke.png) no-repeat 4px center, linear-gradient(to bottom, #767 0%, #989 100%);
}
input.reload, input.reload:active {
background: #989 url(images/restore.png) no-repeat 2px center;
background: url(images/restore.png) no-repeat 2px center, linear-gradient(to bottom, #989 0%, #878 100%);
background: #989 url(images/restore.png) no-repeat 4px center;
background: url(images/restore.png) no-repeat 4px center, linear-gradient(to bottom, #989 0%, #878 100%);
padding: 4px 3px 4px 18px !important;
min-height: 22px;
}
input.reload:hover, input.reload:focus {
background: #767 url(images/restore.png) no-repeat 2px center;
background: url(images/restore.png) no-repeat 2px center, linear-gradient(to bottom, #767 0%, #989 100%);
background: #767 url(images/restore.png) no-repeat 4px center;
background: url(images/restore.png) no-repeat 4px center, linear-gradient(to bottom, #767 0%, #989 100%);
}
input.reload[name="recheck"], input.reload[name="recheck"]:active {
background: #989 url(images/recheck.png) no-repeat 2px center;
background: url(images/recheck.png) no-repeat 2px center, linear-gradient(to bottom, #989 0%, #878 100%);
background: #989 url(images/recheck.png) no-repeat 4px center;
background: url(images/recheck.png) no-repeat 4px center, linear-gradient(to bottom, #989 0%, #878 100%);
padding: 4px 3px 4px 18px !important;
min-height: 22px;
}
input.reload[name="recheck"]:hover, input.reload[name="recheck"]:focus {
background: #767 url(images/recheck.png) no-repeat 2px center;
background: url(images/recheck.png) no-repeat 2px center, linear-gradient(to bottom, #767 0%, #989 100%);
background: #767 url(images/recheck.png) no-repeat 4px center;
background: url(images/recheck.png) no-repeat 4px center, linear-gradient(to bottom, #767 0%, #989 100%);
}
input.starttorrent, input.starttorrent:active {
background: #989 url(images/next.png) no-repeat 2px center;
background: url(images/next.png) no-repeat 2px center, linear-gradient(to bottom, #989 0%, #878 100%);
background: #989 url(images/next.png) no-repeat 4px center;
background: url(images/next.png) no-repeat 4px center, linear-gradient(to bottom, #989 0%, #878 100%);
padding: 4px 3px 4px 18px !important;
min-height: 22px;
}
input.starttorrent:hover, input.starttorrent:focus {
background: #767 url(images/next.png) no-repeat 2px center;
background: url(images/next.png) no-repeat 2px center, linear-gradient(to bottom, #767 0%, #989 100%);
background: #767 url(images/next.png) no-repeat 4px center;
background: url(images/next.png) no-repeat 4px center, linear-gradient(to bottom, #767 0%, #989 100%);
}
input.stoptorrent, input.stoptorrent:active {
background: #989 url(images/btn_stop.png) no-repeat 2px center;
background: url(images/btn_stop.png) no-repeat 2px center, linear-gradient(to bottom, #989 0%, #878 100%);
background: #989 url(images/btn_stop.png) no-repeat 4px center;
background: url(images/btn_stop.png) no-repeat 4px center, linear-gradient(to bottom, #989 0%, #878 100%);
padding: 4px 3px 4px 18px !important;
min-height: 22px;
}
input.stoptorrent:hover, input.stoptorrent:focus {
background: #767 url(images/btn_stop.png) no-repeat 2px center;
background: url(images/btn_stop.png) no-repeat 2px center, linear-gradient(to bottom, #767 0%, #989 100%);
background: #767 url(images/btn_stop.png) no-repeat 4px center;
background: url(images/btn_stop.png) no-repeat 4px center, linear-gradient(to bottom, #767 0%, #989 100%);
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
input[type="submit"], input[type="reset"], a.control {
padding-left: 21px !important;
}
}
.configsectionpanel tr:nth-last-child(2) td {
@@ -1328,7 +1353,7 @@ select {
background: url(images/dropdown.png) right center no-repeat, url(images/graytile.png) #212 !important;
background-size: 17px 17px, 96px 96px !important;
color: #f60;
font: 8pt "Bitstream Vera Sans", Verdana, Tahoma, Helvetica, sans-serif;
font: 8pt "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
font-weight: bold;
padding: 2px 18px 2px 1px;
border-radius: 2px;
@@ -1371,6 +1396,10 @@ select option:hover {
select {
padding: 4px 18px 4px 4px;
}
select + select {
margin-left: -12px !important;
}
}
textarea {
@@ -1399,11 +1428,6 @@ img:hover {
line-height: 100%;
}
img.thumb { /* consistent size for thumbnail images in file manifest */
width: 16px;
border-radius: 1px;
}
img[src$="magnet.png"] {
transform: rotate(-90deg);
}

110
installer/resources/themes/snark/vanilla/snark.css
View File

@@ -217,8 +217,8 @@ body.iframed {
color: #cfc7c2;
height: 56px;
width: auto;
background: #3f3833 url('/themes/snark/ubergine/images/hat.png') no-repeat scroll right center;
background: url('/themes/snark/ubergine/images/hat.png') no-repeat scroll right center, linear-gradient(to bottom, #5f554d 0%, #3f3833 100%);
background: #3f3833 url(images/hat.png) no-repeat scroll right center;
background: url(images/hat.png) no-repeat scroll right center, linear-gradient(to bottom, #5f554d 0%, #3f3833 100%);
background-size: 80px 83px, 100% 100%;
}
@@ -691,6 +691,10 @@ table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:hover {
background: #cfbda8 !important;
}
.snarkDirInfo tr:hover .snarkFileStatus img {
mix-blend-mode: normal;
}
.snarkTorrentEven + .snarkTorrentEven:nth-child(even), .snarkTorrentOdd + .snarkTorrentOdd:nth-child(even) {
background: #303;
background: #cfc8c2;
@@ -722,6 +726,11 @@ table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:hover {
width: 16px;
}
.snarkFileIcon img {
filter: none;
-webkit-filter: none;
}
td.snarkFileIcon:first-child {
text-align: center;
}
@@ -811,6 +820,12 @@ thead img.disable, img.disable:hover {
min-width: 0 !important;
}
.snarkDirInfo .ParentDir a, .snarkDirInfo .snarkFileName a, .snarkTorrents .snarkTorrentName a {
display: inline-block;
width: 100%;
padding: 2px 0;
}
.snarkDirInfo .headerpriority {
text-align: right !important;
vertical-align: middle;
@@ -831,8 +846,14 @@ th[colspan="4"] + .headerpriority {
}
.thumb {
max-height: 64px;
max-width: 96px;
transition: ease all 0.3s 0s;
max-width: 16px;
}
.thumb:hover {
max-width: 80px;
max-height: 80px;
transition: ease all 0.3s 0s;
}
.snarkNewTorrent {
@@ -880,6 +901,12 @@ th[colspan="4"] + .headerpriority {
text-shadow: 0 0 1px #fff5ef;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
.snarkConfigTitle, label.toggleview {
font-size: 12pt;
}
}
.snarkConfigTitle a, label.toggleview {
color: #930 !important;
text-shadow: 0 0 1px #fff5ef;
@@ -962,8 +989,9 @@ a:active {
}
a.control, input[type="submit"], input[type="reset"] {
font: 8pt "Droid Sans", "Bitstream Vera Sans", Verdana, "Lucida Sans Unicode", Tahoma, Helvetica, sans-serif;
font: 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
font-weight: bold;
background-size: 14px 14px, 100% 100% !important;
}
a.control, a.controld {
@@ -1007,7 +1035,7 @@ input {
background: #efe6e0;
color: #2f1500;
margin: 2px 4px;
font-family: "Bitstream Vera Sans", Verdana, "Lucida Sans Unicode", Tahoma, Helvetica, sans-serif;
font-family: "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
}
input.r {
@@ -1079,104 +1107,96 @@ input.disabled, input.disabled:hover {
}
input.accept {
background: url(images/accept.png) no-repeat 4px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 22px !important;
background: url(images/accept.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 21px !important;
}
input.accept:hover, input.accept:focus {
background: url(images/accept.png) no-repeat 4px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
background: url(images/accept.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
}
input.add {
background: url(images/add.png) no-repeat 4px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 22px !important;
min-height: 22px;
background: url(images/add.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 21px !important;
}
input.add:hover, input.add:focus {
background: url(images/add.png) no-repeat 4px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
background: url(images/add.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
}
input.cancel {
background: url(images/cancel.png) no-repeat 4px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 22px !important;
min-height: 22px;
background: url(images/cancel.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 21px !important;
}
input.cancel:hover, input.cancel:focus {
background: url(images/cancel.png) no-repeat 4px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
background: url(images/cancel.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
}
input.create {
background: url(images/create.png) no-repeat 4px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 22px !important;
min-height: 22px;
background: url(images/create.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 21px !important;
}
input.create:hover, input.create:focus {
background: url(images/create.png) no-repeat 4px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
background: url(images/create.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
}
input.delete {
background: url(images/nuke.png) no-repeat 4px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 22px !important;
min-height: 22px;
background: url(images/nuke.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 21px !important;
}
input.delete:hover, input.delete:focus {
background: url(images/nuke.png) no-repeat 4px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
background: url(images/nuke.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
}
input.reload {
background: url(images/restore.png) no-repeat 4px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 22px !important;
min-height: 22px;
background: url(images/restore.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 21px !important;
}
input.reload:hover, input.reload:focus {
background: url(images/restore.png) no-repeat 4px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
background: url(images/restore.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
}
input.reload[name="recheck"] {
background: url(images/recheck.png) no-repeat 4px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 22px !important;
min-height: 22px;
background: url(images/recheck.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 21px !important;
float: right;
margin: 6px 2px;
}
input.reload[name="recheck"]:hover, input.reload[name="recheck"]:focus {
background: url(images/recheck.png) no-repeat 4px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
background: url(images/recheck.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
}
input.starttorrent {
background: url(images/next.png) no-repeat 4px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 22px !important;
min-height: 22px;
background: url(images/next.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 18px !important;
float: right;
margin: 6px;
}
input.starttorrent:hover, input.starttorrent:focus {
background: url(images/next.png) no-repeat 4px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
background: url(images/next.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
}
input.stoptorrent {
background: url(images/btn_stop.png) no-repeat 4px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 22px !important;
min-height: 22px;
background: url(images/btn_stop.png) no-repeat 5px center, linear-gradient(to bottom, #eeecea 0%, #eeecea 50%, #ded9d5 50%, #ded9d5 100%);
padding: 5px 5px 5px 21px !important;
float: right;
margin: 6px;
}
input.stoptorrent:hover, input.stoptorrent:focus {
background: url(images/btn_stop.png) no-repeat 4px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
background: url(images/btn_stop.png) no-repeat 5px center, linear-gradient(to bottom, #fff7ef 0%, #fff7ef 51%, #cfc1b5 52%, #cfc1b5 100%);
}
select {
background: #efe6e0 url(images/dropdown.png) right center no-repeat !important;
color: #2f1500;
font: 8pt "Bitstream Vera Sans", Verdana, "Lucida Sans Unicode", Tahoma, Helvetica, sans-serif;
font: 8pt "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
font-weight: bold;
padding: 5px 14px 5px 5px;
border-radius: 2px;
@@ -1217,7 +1237,7 @@ textarea, input[name="nofilter_dataDir"] {
border: 1px solid #2f1500;
font-size: 8pt;
margin-left: 5px;
font-family: "Bitstream Vera Sans", Verdana, "Lucida Sans Unicode", Tahoma, Helvetica, sans-serif;
font-family: "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
width: 70%;
}
@@ -1260,10 +1280,6 @@ img[src$="details.png"] {
mix-blend-mode: luminosity;
}
img.thumb {
width: 16px;
}
.snarkFileStatus img {
mix-blend-mode: luminosity;
}

153
installer/resources/themes/susidns/classic/susidns.css
View File

@@ -5,6 +5,7 @@ body {
font: 9pt/130% "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Helvetica, sans-serif;
background: #eef;
color: #0c153d;
min-width: 700px;
}
body.iframed {
@@ -78,9 +79,33 @@ table.book td:nth-child(2) {
white-space: nowrap;
}
table.book td:nth-child(3), table.book td:nth-child(4) {
width: 50px;
table.book td:nth-child(3) {
width: 30px;
white-space: nowrap;
padding-left: 10px;
}
.book td:nth-child(4) {
text-align: center;
width: 20px;
padding: 2px 25px 2px 0 !important;
}
.book td:nth-child(4) a:not(old) {
font-size: 0 !important;
}
.book td:nth-child(4) .addrhlpr a::after {
content: url(/themes/console/images/buttons/fullview.png);
text-align: center;
padding: 0 10px !important;
filter: drop-shadow(0 0 1px #555);
-webkit-filter: drop-shadow(0 0 1px #555);
}
.book td:nth-child(4) .addrhlpr:hover {
filter: drop-shadow(0 0 1px #f60);
-webkit-filter: drop-shadow(0 0 1px #f60);
}
td.destinations {
@@ -219,8 +244,8 @@ h4 {
}
a {
color:#006;
text-decoration:none;
color: #33a;
text-decoration: none;
font-weight: bold;
}
@@ -298,9 +323,14 @@ p.book, #messages + p {
}
p.footer {
font-size:7pt;
font-size: 7pt;
text-align: center;
padding: 10px 0 0;
padding: 0;
margin: 12px auto -15px;
border: 1px solid #89f;
border-radius: 0 0 3px 3px;
width: 200px;
background: #fff;
}
.iframed #footer {
@@ -331,17 +361,20 @@ div#filter {
font-size: 10pt;
box-shadow: inset 0 0 0 1px #fff;
text-transform: capitalize;
color: #006;
color: #555;
}
#filter a:hover {
#filter a:hover, #filter a:focus {
text-decoration: none;
color: #f60;
border: 1px solid #f60;
border-radius: 2px;
color: #f60 !important;
border: 1px solid #f60 !important;
background: #fff;
}
#filter a:active {
box-shadow: inset 3px 3px 3px #999;
}
#filter p b {
font-size: 12pt;
vertical-align: bottom;
@@ -411,6 +444,9 @@ td.search:last-child {
#search input[type="text"] {
width: 200px;
margin-left: 10px;
background: url(/themes/console/images/buttons/search.png) 5px center no-repeat;
padding: 5px 5px 5px 25px;
}
#messages:empty {
@@ -479,6 +515,11 @@ input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
color: #000;
}
input[type="submit"]::-moz-focus-inner, input[type="reset"]::-moz-focus-inner {
border: none;
outline: none;
}
input[type="submit"], input[type="reset"] {
min-width: 80px;
}
@@ -510,17 +551,30 @@ button, input[type="submit"], input[type="reset"] {
background: #eee;
background: linear-gradient(to bottom, #fff 0%, #ddd 100%);
margin: 2px 0 2px 4px;
filter: drop-shadow(0 0 1px #ccc);
color: #333;
}
button:hover, input[type="submit"]:hover, input[type="reset"]:hover {
button:hover, input[type="submit"]:hover, input[type="reset"]:hover,
button:focus, input[type="submit"]:focus, input[type="reset"]:focus {
background: #fff;
background: linear-gradient(to bottom, #ddd 0%, #fff 100%);
border: 1px solid #bbb;
border: 1px solid #89f;
filter: drop-shadow(0 0 1px #89f);
-webkit-filter: drop-shadow(0 0 1px #89f);
color: #222;
}
button:active, input[type="submit"]:active, input[type="reset"]:active {
background: #ddd;
box-shadow: inset 3px 3px 3px #999;
box-shadow: inset 0 0 0 1px #fff, inset 3px 3px 3px #999;
border: 1px solid #bbb;
color: #333;
}
input[type="radio"], input[type="checkbox"] {
min-width: 16px;
min-height: 16px;
}
form[action="subscriptions"], form[action="config"] {
@@ -537,7 +591,7 @@ form[action="subscriptions"] textarea {
padding: 3px !important;
}
#navi a {
#navi a, #navi a:visited {
border: 1px solid #6b78bf;
border-radius: 2px;
margin: 3px 0 !important;
@@ -545,16 +599,19 @@ form[action="subscriptions"] textarea {
-webkit-filter: drop-shadow(0 0 1px #ccc);
display: inline-block;
outline: none;
color: #448 !important;
}
#navi a:hover, #navi a:focus {
border: 1px solid #f60;
color: #f60 !important;
}
#navi a:active {
border: 1px solid #f90;
box-shadow: inset 2px 2px 2px #555;
background-blend-mode: luminosity;
color: #777 !important;
}
#navi a.abook {
@@ -638,7 +695,7 @@ form[action="subscriptions"] textarea {
}
p#filtered {
background: #fff url(/themes/susidns/images/filter.png) 18px center no-repeat;
background: #fff url(/themes/console/images/buttons/filter.png) 18px center no-repeat;
padding: 0 10px 0 38px !important;
}
@@ -646,3 +703,67 @@ p.book {
background: #fff url(/themes/susidns/images/abook.png) 18px center no-repeat;
padding: 0 10px 0 38px !important;
}
/* responsive layout */
@media screen and (min-width: 1400px) {
body, p, td, textarea, input, button, li, a {
font-size: 10pt !important;
}
code, tt {
font-size: 9pt !important;
}
h4, #navi a {
font-size: 11pt;
}
h3 {
font-size: 12pt !important;
}
p.footer {
margin: 12px auto -21px !important;
}
#export {
margin-top: -40px !important;
}
#filter span, #filter a {
font-size: 11pt !important;
}
}
/* end responsive layout */
/* export hosts */
#export {
text-align: right;
margin-top: -36px;
margin-bottom: -4px;
}
#filter {
margin-top: -2px !important;
}
p#filtered {
padding-right: 200px !important;
padding-top: 2px !important;
padding: 2px 200px 0 20px !important;
background-position: left center !important;
}
#book p {
margin-left: 2px;
}
p.book {
padding-left: 26px !important;
background-position: left center !important;
}

448
installer/resources/themes/susidns/dark/susidns.css
View File

@@ -4,10 +4,11 @@
body {
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Helvetica, sans-serif;
line-height:120%;
background-color: #000;
background: #000;
color:#ee9;
padding-top: 5px;
margin: 0 10px;
min-width: 650px;
}
body.iframed {
@@ -15,16 +16,50 @@ body.iframed {
margin: 0;
}
::selection {
background: #030 !important;
color: white;
}
::-moz-selection {
background: #030 !important;
color: white;
}
.page {
color:#ee9;
margin: 10px 0;
padding: 0 5px;
font-size: 9pt !important;
box-shadow: inset 0 0 1px 0 #002;
background: #000;
}
.iframed .page {
margin: 0;
padding: 0 15px;
}
#logo {
display: none;
}
#logo img {
display: none;
}
/* topnav */
div#navi {
border: 1px solid #2a5f29;
padding: 10px 0 5px;
padding: 5px 3px;
background: #000 url(/themes/console/dark/images/header.png) repeat-x scroll center center !important;
background-image: linear-gradient(to bottom, #001000 0%, #001900 50%, #000 51%, #000 100%) !important;
margin-bottom: 30px;
background: linear-gradient(to bottom, #001000 0%, #001900 50%, #000 51%, #000 100%) !important;
margin: -16px auto 30px;
position: sticky;
top: -1px;
border-radius: 0 0 2px 2px;
z-index: 999;
}
.iframed div#navi {
@@ -32,7 +67,8 @@ div#navi {
border: 1px solid #494;
border-right: none;
border-left: none;
padding: 6px 0 2px;
padding: 5px 0;
border-radius: 0;
}
#navi p {
@@ -45,6 +81,102 @@ div#navi {
text-transform: capitalize;
}
#navi a, #navi a:visited {
color: #494 !important;
border: 1px solid #2a5f29;
border-radius: 2px;
display: inline-block;
margin: 1px 0;
box-shadow: inset 0 0 0 1px #000;
filter: drop-shadow(0 0 1px #000);
-webkit-filter: drop-shadow(0 0 1px #000);
}
#navi a:hover, #navi a:focus {
border: 1px solid #f60;
color: #f60 !important;
background: #000;
box-shadow: inset 0 1px 1px #ee9;
}
#navi a:active {
border: 1px solid #f60;
box-shadow: inset 3px 3px 3px #000;
box-shadow: inset 0 0 0 1px #000, inset 3px 3px 3px #000;
color: #ee9 !important;
background-blend-mode: luminosity;
}
#navi a.abook {
background: #000 url(/themes/susidns/images/abook.png) 5px center no-repeat;
background: url(/themes/susidns/images/abook.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
padding: 3px 5px 3px 24px;
}
#navi a.abook:hover, #navi a.abook:focus {
background: #000 url(/themes/susidns/images/abook.png) 5px center no-repeat !important;
}
#navi a.abook:active {
background: #f60 url(/themes/susidns/images/abook.png) 5px center no-repeat !important;
}
#navi a#subs {
background: #000 url(/themes/susidns/images/subs.png) 5px center no-repeat;
background: url(/themes/susidns/images/subs.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
padding: 3px 5px 3px 24px;
}
#navi a#subs:hover, #navi a#subs:focus {
background: #000 url(/themes/susidns/images/subs.png) 5px center no-repeat !important;
}
#navi a#subs:active {
background: #f60 url(/themes/susidns/images/subs.png) 5px center no-repeat !important;
}
#navi a#config {
background: #000 url(/themes/console/images/buttons/configure.png) 5px center no-repeat;
background: url(/themes/console/images/buttons/configure.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
padding: 3px 5px 3px 24px;
}
#navi a#config:hover, #navi a#config:focus {
background: #000 url(/themes/console/images/buttons/configure.png) 5px center no-repeat !important;
}
#navi a#config:active {
background: #f60 url(/themes/console/images/buttons/configure.png) 5px center no-repeat !important;
}
#navi a#overview {
background: #000 url(/themes/susidns/images/overview.png) 5px center no-repeat;
background: url(/themes/susidns/images/overview.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
padding: 3px 5px 3px 24px;
}
#navi a#overview:hover, #navi a#overview:focus {
background: #000 url(/themes/susidns/images/overview.png) 5px center no-repeat !important;
}
#navi a#overview:active {
background: #f60 url(/themes/susidns/images/overview.png) 5px center no-repeat !important;
}
#navi p {
text-align: center !important;
text-transform: capitalize;
font-weight: bold;
padding: 2px 5px !important;
margin: 0 !important;
}
#navi p > * {
vertical-align: middle;
}
/* end topnav */
hr {
color: #494;
background: #494;
@@ -60,11 +192,12 @@ div#filter {
border: 1px solid #2a5f29;
padding: 0 0 15px;
text-align: center;
background: #000;
}
div#filter + div#search {
border: 1px solid #2a5f29;
margin-top: 13px;
margin: -1px 0 14px !important;
}
div#filter + div#search > form {
@@ -78,7 +211,8 @@ div#filter + div#search > form {
}
#search {
text-align: center
text-align: center;
background: #000;
}
#search table {
@@ -99,7 +233,6 @@ div#filter + div#search > form {
}
#filter p {
/* border: 1px solid #f00; */
padding: 20px 20px 10px 17px;
text-align: center;
}
@@ -113,7 +246,6 @@ div#filter + div#search > form {
}
#search {
/* border: 1px solid #2a5f29; */
padding: 0 10px;
margin-top: 5px !important;
margin-bottom: 15px;
@@ -139,6 +271,7 @@ div#filter + div#search > form {
background: linear-gradient(to bottom, #010 0%, #000 100%);
font-size: 10pt;
text-transform: uppercase;
white-space: nowrap;
}
#filter a:hover {
@@ -149,6 +282,10 @@ div#filter + div#search > form {
background: #020;
}
#filter a:active {
box-shadow: inset 3px 3px 3px #000;
}
#filter span {
display: inline-block;
border: 1px solid #2a5f29;
@@ -165,6 +302,10 @@ div#filter + div#search > form {
background: none;
}
#filter span a:active {
box-shadow: none;
}
#filter span b {
text-transform: uppercase;
font-size: 10pt;
@@ -178,16 +319,6 @@ p {
text-align: justify;
}
#messages + p, p.book {
border: 1px solid #2a5f29;
background: #000 url(/themes/susidns/images/addressbook.png) 10px center no-repeat;
padding: 20px 20px 20px 50px !important;
}
#messages:empty {
margin-top: -10px
}
span.addrhlpr {
font-size: 9pt;
}
@@ -234,15 +365,40 @@ div.headline {
}
div#messages {
margin: -16px 0 25px !important;
background: #020;
z-index: 999;
border: 1px solid #2a5f29;
box-shadow: inset 0 0 0 1px #000;
line-height: 120%;
}
div#messages + p {
#messages p {
padding: 15px 15px 15px 40px !important;
background: url(/themes/console/dark/images/infohelp.png) 6px center no-repeat;
color: #ee9;
padding: 5px 5px 10px;
margin: 0;
border-radius: 0;
}
#messages + p, p.book {
border: 1px solid #2a5f29;
background: #000 url(/themes/susidns/images/addressbook.png) 10px center no-repeat;
padding: 20px 20px 20px 50px !important;
}
#messages:empty {
display: none;
}
p#filtered {
padding: 12px 10px 8px 20px;
font-size: 10pt;
margin-bottom: 15px;
margin: -15px 0 10px;
}
div#book p {
div#book p, p.messages {
font-size: 10pt;
}
@@ -250,32 +406,49 @@ div#book p {
padding: 0 !important;
}
.book td {
padding: 0;
}
.book td:nth-child(3) {
padding: 2px 0 2px 5px !important;
width: 30px;
}
.book td:nth-child(4) {
text-align: center;
width: 20px;
padding: 2px 25px 2px 0 !important;
}
.book td:nth-child(4) a:not(old) {
font-size: 0 !important;
}
.book td:nth-child(4) .addrhlpr a::after {
content: url(/themes/console/images/buttons/fullview.png);
text-align: center;
padding: 0 10px !important;
filter: drop-shadow(0 0 1px #555);
-webkit-filter: drop-shadow(0 0 1px #555);
}
.book td:nth-child(4) .addrhlpr:hover {
filter: drop-shadow(0 0 1px #f60);
-webkit-filter: drop-shadow(0 0 1px #f60);
}
h4 {
font-size: 9pt;
margin-top: -15px;
word-spacing: 0.1em;
border: 1px solid #2a5f29;
padding: 8px 10px;
padding: 8px 10px 8px 35px;
margin-bottom: 30px !important;
background-image: linear-gradient(to bottom, #001000 0%, #001900 50%, #000 51%, #000 100%) !important;
background: #000 url(/themes/susidns/drive.png) 9px center no-repeat;
background: url(/themes/susidns/images/drive.png) 9px center no-repeat, linear-gradient(to bottom, #001000 0%, #001900 50%, #000 51%, #000 100%) !important;
}
div#messages > p.messages {
padding: 10px;
}
#messages p {
padding: 15px 15px 15px 40px !important;
background: url(/themes/console/dark/images/infohelp.png) 6px center no-repeat;
}
/*
a {
color:#f60;
text-decoration:none;
font-weight: bold;
}
*/
a:link {
color: #494;
text-decoration: none;
@@ -307,7 +480,6 @@ th {
td {
color: #ee9;
line-height: 12pt;
padding: 5px;
font-size: 9pt;
vertical-align: middle;
@@ -369,7 +541,6 @@ ol, ul {
li {
color: #ee9;
line-height: 12pt;
margin: 0;
font-size: 9pt;
list-style: square;
@@ -383,20 +554,9 @@ tr.list0 {
background-color: #000;
}
p.messages {
/* background-color:#000; */
color:#ee9;
border: 1px solid #2a5f29;
padding: 5px 5px 10px;
margin: 5px 0 10px;
margin: -15px 0 14px;
border-radius: 0;
}
.help {
border: 1px solid #2a5f29;
padding: 20px 30px;
background: #000;
}
.help h3 {
@@ -412,14 +572,18 @@ p.messages {
}
#helpsubs {
padding: 0;
padding: 0 0 0 40px;
background: #000 url(/themes/console/dark/images/infohelp.png) 15px center no-repeat !important;
}
#helpsubs p {
border: none;
line-height: 130%;
padding: 15px;
}
div#content {
#helpconfig {
background: #000;
}
div#content p {
@@ -427,8 +591,9 @@ div#content p {
}
p.footer {
font-size:7pt;
font-size: 7pt;
text-align: center;
display: none;
}
.iframed #footer {
@@ -444,7 +609,8 @@ p.buttons, #buttons {
div#book + div#buttons {
border: 1px solid #2a5f29;
padding: 0 0 10px;
margin-top: -1px;
margin-top: 3px;
background: #000;
}
form[action="export"] > div#buttons {
@@ -456,7 +622,7 @@ form[action="export"] > div#buttons {
div#config > textarea, div#content > textarea {
border-radius: 0;
margin-top: -17px;
margin-top: -26px;
}
textarea[name="config"] {
@@ -489,6 +655,7 @@ div#config + div#buttons, div#content + div#buttons {
div#book {
padding: 0;
margin: -15px 0 -5px;
}
#book table {
@@ -512,6 +679,10 @@ div#book {
background: #001a00;
}
#book table tr:hover td textarea {
color: #ee9;
}
#book th:first-child {
background: url(/themes/console/dark/images/header.png) repeat-x scroll center center #000;
background: url(images/bin.png) center center no-repeat, linear-gradient(to bottom, #001000 0%, #001900 50%, #000 51%, #000 100%) !important;
@@ -556,19 +727,6 @@ div#add {
padding-top: 5px;
}
.page {
color:#ee9;
margin: 10px 0;
padding: 0 5px;
font-size: 9pt !important;
box-shadow: inset 0px 0px 1px 0px #002;
}
.iframed .page {
margin: 0;
padding: 0 15px;
}
input[type="submit"]:hover, input[type="reset"]:hover, input[type="submit"]:focus, input[type="reset"]:focus {
background: #000;
color: #f60;
@@ -585,7 +743,7 @@ input {
font-size: 9pt;
font-weight: bold;
text-align: left;
padding: 3px 4px !important;
padding: 5px !important;
border-radius: 2px;
border: 1px solid #2a5f29;
background: #000 none !important;
@@ -601,7 +759,7 @@ input[type="submit"], input[type="reset"] {
border: 1px outset #191;
border-radius: 2px;
margin: 5px;
padding: 4px 2px !important;
padding: 5px !important;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Helvetica, sans-serif;
text-align: center;
min-height: 22px !important;
@@ -611,9 +769,10 @@ input[type="submit"], input[type="reset"] {
input[type=submit]:active, input[type=reset]:active {
background: #f60 !important;
color: #ee9 !important;
border: 1px inset #f60;
border: 1px solid #f60;
filter: none;
box-shadow: none;
box-shadow: inset 3px 3px 3px #000;
box-shadow: inset 0 0 0 1px #000, inset 3px 3px 3px #000;
}
input[type="submit"], input[type="reset"], select, button { /* webkit/blink fix for oversaturated colors */
@@ -637,7 +796,7 @@ input[type="text"], textarea {
textarea {
color: #bb7;
border: 1px solid #2a5f29;
padding: 3px;
padding: 3px 5px;
font: bold 8.5pt "Noto Mono", "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", Courier, mono;
border-radius: 2px;
width: 100%;
@@ -653,10 +812,13 @@ textarea[cols="70"] {
.destinations textarea {
width: 100%;
width: calc(100% - 3px);
padding: 1px !important;
height: 34px;
height: 32px;
resize: none;
border: none;
border-left: 1px solid #2a5f29;
margin: 0 !important;
border-radius: 0;
}
input:focus, textarea:focus {
@@ -667,63 +829,20 @@ input:focus, textarea:focus {
transition: ease filter 0.3s 0s;
}
/* topnav */
#navi {
padding: 8px 3px !important;
textarea:focus {
filter: none;
-webkit-filter: none;
box-shadow: inset 0 0 1px #880;
}
#navi a {
border: 1px solid #494;
border-radius: 2px;
filter: drop-shadow(0 0 1px #000);
-webkit-filter: drop-shadow(0 0 1px #000);
input[name="search"] {
background: url(/themes/console/images/buttons/search.png) 5px center no-repeat, linear-gradient(to bottom, #000 0%, #010 100%) !important;
padding: 5px 5px 5px 25px !important;
}
#navi a:hover {
border: 1px solid #f60;
}
#navi a:active {
border: 1px solid #f90;
box-shadow: inset 2px 2px 2px #000;
background-blend-mode: luminosity;
}
#navi a.abook {
background: #000 url(/themes/susidns/images/abook.png) 5px center no-repeat;
background: url(/themes/susidns/images/abook.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
padding: 4px 5px 4px 24px;
}
#navi a#subs {
background: #000 url(/themes/susidns/images/subs.png) 5px center no-repeat;
background: url(/themes/susidns/images/subs.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
padding: 4px 5px 4px 24px;
}
#navi a#config {
background: #000 url(/themes/console/images/buttons/configure.png) 5px center no-repeat;
background: url(/themes/console/images/buttons/configure.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
padding: 4px 5px 4px 24px;
}
#navi a#overview {
background: #000 url(/themes/susidns/images/overview.png) 5px center no-repeat;
background: url(/themes/susidns/images/overview.png) 5px center no-repeat, linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%);
padding: 4px 5px 4px 24px;
}
#navi p {
text-align: center !important;
text-transform: capitalize;
font-weight: bold;
padding: 2px 5px !important;
margin: 0 !important;
}
#navi p > * {
vertical-align: middle;
input[name="search"]:focus {
background: #000 url(/themes/console/images/buttons/search.png) 5px center no-repeat !important;
padding: 5px 5px 5px 25px !important;
}
/* page titles */
@@ -744,3 +863,70 @@ input:focus, textarea:focus {
.headline#config h3 {
background: url(/themes/susidns/images/configure_24.png) 5px center no-repeat, linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000000 56%, #000000 100%);
}
/* responsive layout */
@media screen and (max-width: 710px) {
#navi a {
background: linear-gradient(to bottom, #020 0%, #020 50%, #000 50%, #000 100%) !important;
padding: 3px 8px !important;
}
}
@media screen and (min-width: 1400px) {
textarea {
font-size: 9pt;
}
body, input[type="submit"], input[type="reset"], input, select, h4, td.names a, p, li {
font-size: 10pt !important;
}
div#navi {
padding: 6px 5px !important;
}
#navi a {
font-size: 10.5pt !important;
padding: 6px 5px 6px 25px !important;
}
h3, #filter a {
font-size: 11pt !important;
}
#filter a:link, #filter a:visited {
margin: 3px 2px !important;
}
}
/* end responsive layout */
/* export hosts button adjustments */
#export {
text-align: right;
margin-top: -58px;
margin-bottom: 23px;
padding-right: 4px;
float: right;
clear: left !important;
}
#export input[type="submit"] {
display: inline-block;
}
p#filtered {
padding-left: 35px !important;
padding-right: 250px !important;
}
p.book {
padding-left: 35px !important;
}
#messages + p, p.book {
border: 1px solid #2a5f29;
background: #000 url(/themes/susidns/images/addressbook.png) 5px center no-repeat;
}

45
installer/resources/themes/susidns/light/susidns.css
View File

@@ -488,6 +488,7 @@ td.search:first-child {
background: #f60;
text-decoration: none;
box-shadow: inset 0 0 0 1px #fff;
box-shadow: inset 0 0 0 1px #fff, inset 3px 3px 3px #333;
}
#filter span {
@@ -599,6 +600,35 @@ table.book {
font-weight: bold;
}
.book td:nth-child(3) {
width: 30px;
white-space: nowrap;
padding-left: 10px;
}
.book td:nth-child(4) {
text-align: center;
width: 20px;
padding: 2px 25px 2px 0 !important;
}
.book td:nth-child(4) a:not(old) {
font-size: 0 !important;
}
.book td:nth-child(4) .addrhlpr a::after {
content: url(/themes/console/images/buttons/fullview.png);
text-align: center;
padding: 0 10px !important;
filter: drop-shadow(0 0 1px #555);
-webkit-filter: drop-shadow(0 0 1px #555);
}
.book td:nth-child(4) .addrhlpr:hover {
filter: drop-shadow(0 0 1px #f60);
-webkit-filter: drop-shadow(0 0 1px #f60);
}
.book th {
border-bottom: 1px solid #7778bf;
}
@@ -841,3 +871,18 @@ form[action="addressbook"] table {
width: 100% !important;
font-weight: bold;
}
/* export hosts */
#export {
text-align: right;
margin-top: -36px;
}
#filter {
margin-top: -2px !important;
}
p#filtered {
padding-right: 200px !important;
}

499
installer/resources/themes/susidns/midnight/susidns.css
View File

@@ -2,9 +2,9 @@
/* Author: dr|z3d */
body {
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Helvetica, sans-serif;
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
background-color: #000;
color:#C9CEFF;
color:#c9ceff;
margin: 0 10px;
font-size: 9pt;
}
@@ -20,32 +20,127 @@ body.iframed {
display: none;
}
/* topnav */
div#navi {
border: 1px solid #2d295f;
padding: 5px 0;
padding: 2px 0;
background: #002 url(/themes/console/midnight/images/header.png) repeat-x scroll center center !important;
background: linear-gradient(to bottom, #191729 0%, #201f33 7%, #1f1e32 9%, #161525 21%, #090812 49%, #05050e 50%, #020206 51%, #010103 53%, #000000 56%, #000000 100%) !important;
margin-bottom: 30px;
margin: -10px 0 27px;
box-shadow: inset 0 0 0 1px #000;
position: sticky;
top: 0;
z-index: 999;
}
/*
.iframed #navi {
border-left: none;
border-right: none;
border-radius: 0;
padding: 0 !important;
border: 1px solid #443da0 !important;
margin: 0 0 27px;
}
#navi a, #navi a:visited {
border: 1px solid #2d295f;
border-radius: 2px;
padding: 5px;
margin: 3px 0 !important;
filter: drop-shadow(0 0 1px #000);
-webkit-filter: drop-shadow(0 0 1px #000);
display: inline-block;
outline: none;
text-transform: capitalize;
color: #928fbf !important;
box-shadow: inset 0 0 0 1px #000;
}
#navi a:hover, #navi a:focus {
border: 1px solid #652787;
color: #652787 !important;
}
#navi a:active {
border: 1px solid #652787;
background-blend-mode: luminosity;
box-shadow: inset 0 0 0 1px #000, inset 3px 3px 3px #000 !important;
color: #c9ceff !important;
}
#navi a.abook {
background: #001 url(/themes/susidns/images/abook.png) 6px center no-repeat;
background: url(/themes/susidns/images/abook.png) 6px center no-repeat, linear-gradient(to bottom, #25233f 50%, #000 50%);
padding: 5px 8px 5px 25px;
}
#navi a.abook:hover, #navi a.abook:focus {
background: #000 url(/themes/susidns/images/abook.png) 6px center no-repeat !important;
box-shadow: inset 0 1px 1px 0 #c9ceff;
}
#navi a.abook:active {
background: #652787 url(/themes/susidns/images/abook.png) 6px center no-repeat !important;
}
#navi a#subs {
background: #001 url(/themes/susidns/images/subs.png) 6px center no-repeat;
background: url(/themes/susidns/images/subs.png) 6px center no-repeat, linear-gradient(to bottom, #25233f 50%, #000 50%);
padding: 5px 8px 5px 25px;
}
#navi a#subs:hover, #navi a#subs:focus {
background: #001 url(/themes/susidns/images/subs.png) 6px center no-repeat;
box-shadow: inset 0 1px 1px 0 #c9ceff;
}
#navi a#subs:active {
background: #652787 url(/themes/susidns/images/subs.png) 6px center no-repeat;
}
#navi a#config {
background: #001 url(/themes/console/images/buttons/configure.png) 6px center no-repeat;
background: url(/themes/console/images/buttons/configure.png) 6px center no-repeat, linear-gradient(to bottom, #25233f 50%, #000 50%);
padding: 5px 8px 5px 25px;
}
#navi a#config:hover, #navi a#config:focus {
background: #000 url(/themes/console/images/buttons/configure.png) 6px center no-repeat;
box-shadow: inset 0 1px 1px 0 #c9ceff;
}
#navi a#config:active {
background: #652787 url(/themes/console/images/buttons/configure.png) 6px center no-repeat;
}
#navi a#overview {
background: #001 url(/themes/susidns/images/overview.png) 6px center no-repeat;
background: url(/themes/susidns/images/overview.png) 6px center no-repeat, linear-gradient(to bottom, #25233f 50%, #000 50%);
padding: 5px 8px 5px 25px;
}
#navi a#overview:hover, #navi a#overview:focus {
background: #000 url(/themes/susidns/images/overview.png) 6px center no-repeat;
box-shadow: inset 0 1px 1px 0 #c9ceff;
}
#navi a#overview:active {
background: #652787 url(/themes/susidns/images/overview.png) 6px center no-repeat;
}
*/
#navi p {
text-align: center;
text-align: center !important;
text-transform: capitalize;
font-weight: bold;
font-size: 9pt;
padding: 2px 5px !important;
margin: 0 !important;
}
#navi a:link {
text-transform: capitalize;
#navi p > * {
vertical-align: middle;
}
/* end topnav */
hr {
color: #2d295f;
background: #2d295f;
@@ -66,6 +161,7 @@ div#filter {
div#filter + div#search {
border: 1px solid #2d295f;
margin-top: 13px;
margin-bottom: 14px;
}
div#filter + div#search > form {
@@ -74,14 +170,25 @@ div#filter + div#search > form {
}
#filter p, #search td {
font-size: 10pt !important;
font-size: 9pt !important;
font-weight: bold;
}
#search input {
td.search > * {
vertical-align: middle;
}
#search input[type="text"] {
background: #000 url(/themes/console/images/buttons/search.png) 5px center no-repeat;
background: url(/themes/console/images/buttons/search.png) 5px center no-repeat, linear-gradient(to bottom, #000 0%, #000019 100%) !important;
padding: 5px 5px 5px 25px !important;
margin-left: 5px;
}
#search input[type="text"]:focus {
background: #000 url(/themes/console/images/buttons/search.png) 5px center no-repeat !important;
}
#filter p {
padding: 15px 10px 0;
}
@@ -91,11 +198,10 @@ div#filter + div#search > form {
}
p#filtered {
margin-bottom: 10px !important;
margin: -15px 0 10px !important;
}
#search {
/* border: 1px solid #494; */
padding: 0 10px;
margin-top: -1px !important;
padding-bottom: -20px;
@@ -104,18 +210,29 @@ p#filtered {
#filter a:link, #filter a:visited {
text-transform: capitalize;
background: #000;
border: 1px solid #443da0;
border-radius: 2px;
padding: 2px 5px;
min-width: 16px;
padding: 3px 8px;
text-align: center;
color: #443da0;
display: inline-block;
margin: 0;
margin: 2px 0;
}
#filter a:hover, #filter a:focus {
border: 1px solid #652787;
transform: scale(1.1);
}
#filter a:active {
background: #652787;
color: #c9ceff !important;
box-shadow: inset 0 0 0 1px #000, inset 3px 3px 3px #000;
}
#filter span {
display: inline-block;
display: inherit;
text-align: center;
text-transform: uppercase;
letter-spacing: 0.08em;
@@ -126,7 +243,10 @@ p#filtered {
border-radius: 0 0 2px 2px;
padding: 5px 10px !important;
min-width: 300px;
margin: -1px 10%;
max-width: 500px;
width: 40%;
white-space: nowrap;
margin: -1px auto;
box-shadow: inset 0 0 0 1px #000;
background: url(/themes/console/midnight/images/header.png) repeat-x scroll center center #000;
background-image: linear-gradient(to bottom, #010010 0%, #020019 50%, #060051%, #0100100%) !important;
@@ -138,6 +258,13 @@ p#filtered {
display: inline-block;
border: none !important;
background: !important;
transform: none;
}
#filter span a:active {
background: none;
box-shadow: none;
color: #4f0519 !important;
}
#filter span b {
@@ -157,7 +284,7 @@ p#filtered {
}
p {
color:#C9CEFF;
color:#c9ceff;
margin: 0 0 4px;
font-size: 9pt;
text-align: justify;
@@ -170,8 +297,13 @@ p {
padding: 20px 20px 20px 42px !important;
}
#messages {
margin-bottom: 24px;
}
#messages:empty {
margin-top: -10px
margin-top: -10px;
display: none;
}
span.addrhlpr {
@@ -179,9 +311,9 @@ span.addrhlpr {
}
h3 {
color:#C9CEFF;
font-size:10pt;
font-weight:bold;
color: #c9ceff;
font-size: 10pt;
font-weight: bold;
border: 1px solid #2d295f;
padding: 7px 10px;
border-radius: 2px;
@@ -191,6 +323,7 @@ h3 {
word-spacing: 0.1em;
text-shadow: 0 0 2px #010011;
text-transform: uppercase;
box-shadow: inset 0 0 0 1px #000;
}
#content h3 {
@@ -206,16 +339,6 @@ h3 {
margin-top: 15px !important;
}
/*
.iframed h3, .iframed h4 {
border: none;
border-bottom: 1px solid #443da0;
border-radius: 0;
background: none !important;
margin: 5px 0 10px;
}
*/
.headline h3 {
border-radius: 2px 2px 0 0;
margin-top: -10px;
@@ -257,16 +380,15 @@ h3 {
margin-top: -16px;
}
div#messages {
div#messages p {
}
div#messages + p {
padding: 12px 10px 8px 20px;
font-size: 10pt;
}
div#book p {
font-size: 10pt;
padding: 15px 15px 15px 35px !important;
}
h4 {
@@ -288,14 +410,6 @@ div#messages > p.messages {
background: url(/themes/console/images/info/infohelp.png) 6px center no-repeat;
}
/*
a {
color:#f60;
text-decoration:none;
font-weight: bold;
}
*/
a:link {
color: #443da0;
text-decoration: none;
@@ -318,19 +432,30 @@ a:active {
}
th {
color: #C9CEFF;
color: #c9ceff;
font-size: 9pt;
padding: 5px 10px;
font-size: 10pt;
text-align: left;
}
.iframed .book tr.head th {
border-top: 1px solid #2d295f;
border-bottom: 1px solid #2d295f;
}
.book th:first-child {
background: #000 url(/themes/console/images/buttons/delete.png) center center no-repeat !important;
font-size: 0;
padding: 0 !important;
}
table.book td:first-child {
font-weight: bold;
}
td {
color: #C9CEFF;
color: #c9ceff;
padding: 5px;
font-size: 9pt;
vertical-align: center;
@@ -344,26 +469,6 @@ td.names a {
font-size: 9pt !important;
}
/*
div#buttons + div > table {
width: 100%;
border: 1px solid #2d295f;
margin-top: -46px;
}
div#buttons + div > table > tbody > tr > td {
padding-top: 51px !important;
}
div#buttons + div > table > tbody > tr > td:first-child {
text-align: right;
}
div#buttons + div > table > tbody > tr > td {
text-align: left;
}
*/
td > img[width="320"], td > img[src^="/imagegen"] {
border-radius: 2px;
width: 240px;
@@ -397,8 +502,7 @@ tr.list0 {
}
p.messages {
/* background-color:#000; */
color:#C9CEFF;
color:#c9ceff;
border: 1px solid #2d295f;
padding: 5px 5px 10px;
margin: 5px 0 10px;
@@ -439,24 +543,23 @@ p.messages {
div#content {
}
/*
.iframed #content {
margin: 0 10px;
}
*/
div#content p {
padding: 0 30px;
font-size: 10pt;
}
#content p a, #helpconfig li, p.help {
font-size: 10pt;
}
p.footer {
font-size:7pt;
font-size: 8pt;
text-align: center;
border: 1px solid #113;
padding: 5px 0 2px;
}
#footer {
position: fixed;
bottom: -4px;
width: calc(100% - 20px);
margin: 0;
display: none;
}
.iframed #footer {
@@ -481,7 +584,7 @@ p.buttons {
}
div#book + div#buttons {
margin: -6px 0 20px !important;
margin: 9px 0 20px !important;
}
#add p.buttons {
@@ -495,15 +598,11 @@ form[action="subscriptions"] {
textarea[name="config"], textarea[name="content"] {
border-radius: 0;
margin-top: -17px;
margin-top: -26px;
resize: none;
border: 1px solid #2d295f;
font-size: 8.5pt;
}
/*
.iframed textarea[name="config"], .iframed textarea[name="content"] {
margin: 0 0 20px;
}
*/
textarea[name="config"] {
height: 220px;
@@ -511,10 +610,6 @@ textarea[name="config"] {
resize: none;
}
textarea[name="content"] {
}
div#config + div#buttons, div#content + div#buttons {
border: 1px solid #2d295f;
margin-top: -3px;
@@ -539,14 +634,19 @@ div#config + div#buttons, div#content + div#buttons {
div#book {
padding: 0;
margin: -15px 0 -10px;
}
#book table {
width: 100%;
border: 1px solid #2d295f;
border: 1px solid #2d295f !important;
margin-top: -10px;
}
.iframed #book table {
border: none !important;
}
#book table th {
padding: 5px 0;
background: url(/themes/console/midnight/images/header.png) repeat-x scroll center center #000;
@@ -563,10 +663,42 @@ div#book {
background: #003;
}
#book table tr:hover textarea {
color: #c9ceff;
}
#book, #messages, #filter, #search {
background: #001;
}
.book td:nth-child(3) {
padding: 2px 0 2px 5px !important;
width: 30px;
}
.book td:nth-child(4) {
text-align: center;
width: 20px;
padding: 2px 25px 2px 0 !important;
}
.book td:nth-child(4) a:not(old) {
font-size: 0 !important;
}
.book td:nth-child(4) .addrhlpr a::after {
content: url(/themes/console/images/buttons/fullview.png);
text-align: center;
padding: 2px 10px !important;
filter: drop-shadow(0 0 1px #555);
-webkit-filter: drop-shadow(0 0 1px #555);
}
.book td:nth-child(4) .addrhlpr:hover {
filter: drop-shadow(0 0 1px #b73fff);
-webkit-filter: drop-shadow(0 0 1px #b73fff);
}
.headline + #book > table td {
padding: 5px;
}
@@ -594,11 +726,11 @@ div#add {
}
.page {
color:#C9CEFF;
color:#c9ceff;
margin: 10px 0;
padding: 0;
font-size: 9pt !important;
box-shadow: inset 0px 0px 1px 0px #020022;
background: #000;
}
.iframed .page {
@@ -616,39 +748,47 @@ input {
background: #000 none !important;
color: #443da0;
margin: 2px 4px 2px 0;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Helvetica, sans-serif;
font: bold 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
min-width: 64px !important;
}
input[type=submit]:hover, input[type=reset]:hover {
background: #000;
color: #652787;
border: 1px solid #652787;
box-shadow: inset 0 1px 1px 0 #C9CEFF;
}
input[type="checkbox"], .optbox {
filter: invert(100%) sepia(100%) hue-rotate(200deg) saturate(200%); /* colorize radios and checkboxes */
-webkit-filter: invert(100%) sepia(100%) hue-rotate(200deg) saturate(200%);
}
input[type=submit]::-moz-focus-inner, input[type=reset]::-moz-focus-inner {
border: none;
outline: none;
}
input[type=submit], input[type=reset] {
color: #443da0;
background: #000;
background: linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
border: 1px solid #3e3f8f;
border-bottom-color: #14144f;
border-right-color: #14144f;
padding: 4px 2px !important;
/* box-shadow: 0 1px 1px 0 #190f9b inset; */
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Helvetica, sans-serif;
padding: 5px !important;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
text-align: center;
min-width: 90px;
min-width: 90px !important;
box-shadow: inset 0 0 0 1px #000;
}
input[type=submit]:hover, input[type=reset]:hover,
input[type=submit]:focus, input[type=reset]:focus {
background: #000 !important;
color: #652787;
border: 1px solid #652787;
box-shadow: inset 0 1px 1px 0 #c9ceff;
}
input[type=submit]:active, input[type=reset]:active {
background: #652787 !important;
color: #C9CEFF !important;
color: #c9ceff !important;
border: 1px solid #652787;
box-shadow: inset 3px 3px 3px #000;
}
textarea {
@@ -656,7 +796,7 @@ textarea {
background: #000;
border: 1px solid #443da0;
padding: 3px 5px;
font: bold 8.5pt "Noto Mono", "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", Courier, mono;
font: bold 8.5pt "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", Courier, mono;
border-radius: 2px;
width: 100%;
height: 120px;
@@ -664,6 +804,24 @@ textarea {
resize: none;
}
input[type="text"], textarea {
background: linear-gradient(to bottom, #000 0%, #000019 100%) !important;
box-shadow: inset 0 0 3px 3px #000;
}
input[type="text"]:focus, textarea:focus {
background: #000 !important;
color: #c9ceff;
}
input[type=text]:focus {
color: #c9ceff !important;
background: #000;
filter: drop-shadow(0 0 1px #99f);
-webkit-filter: drop-shadow( 0 0 1px #99f);
transition: filter ease 0.3s 0s;
}
textarea[cols="70"] {
width: 100% !important;
height: 40px;
@@ -679,70 +837,8 @@ textarea[cols="70"] {
border: none;
border-left: 1px solid #17142f;
height: 30px;
}
input:focus, textarea:focus {
color: #C9CEFF;
}
/* topnav */
.iframed #navi {
padding: 0 !important;
border: 1px solid #443da0 !important;
}
#navi a {
border: 1px solid #2d295f;
border-radius: 2px;
padding: 5px;
margin: 3px 0 !important;
filter: drop-shadow(0 0 1px #000);
-webkit-filter: drop-shadow(0 0 1px #000);
display: inline-block;
outline: none;
}
#navi a:hover, #navi a:focus {
border: 1px solid #652787;
color: #652787
}
#navi a:active {
border: 1px solid #4f0519;
background-blend-mode: luminosity;
}
#navi a.abook {
background: #001 url(/themes/susidns/images/abook.png) 5px center no-repeat;
padding: 5px 5px 5px 24px;
}
#navi a#subs {
background: #001 url(/themes/susidns/images/subs.png) 5px center no-repeat;
padding: 5px 5px 5px 24px;
}
#navi a#config {
background: #001 url(/themes/console/images/buttons/configure.png) 5px center no-repeat;
padding: 5px 5px 5px 24px;
}
#navi a#overview {
background: #001 url(/themes/susidns/images/overview.png) 5px center no-repeat;
padding: 5px 5px 5px 24px;
}
#navi p {
text-align: center !important;
text-transform: capitalize;
font-weight: bold;
padding: 2px 5px !important;
margin: 0 !important;
}
#navi p > * {
vertical-align: middle;
overflow-x: auto;
overflow-y: hidden !important;
}
.iframed iframe {
@@ -753,7 +849,7 @@ input:focus, textarea:focus {
.iframed #navi, .iframed h3, .iframed h4, .iframed #book, .iframed #add, .iframed #filtered, .iframed #filter, .iframed #search,
table.book, .iframed #buttons, .iframed .buttons, .iframed #messages + p, .iframed p.book, .iframed #helpsubs,
.iframed textarea[name="config"], .iframed textarea[name="content"], .iframed #helpconfig {
.iframed textarea[name="config"], .iframed textarea[name="content"], .iframed #helpconfig, .iframed p.messages {
border-right: none !important;
border-left: none !important;
}
@@ -784,10 +880,59 @@ table.book, .iframed #buttons, .iframed .buttons, .iframed #messages + p, .ifram
p#filtered {
background: url(/themes/console/images/buttons/filter.png) 13px center no-repeat;
padding: 10px 10px 10px 35px !important;
padding: 15px 15px 15px 35px !important;
}
p.book {
background: url(/themes/susidns/images/abook.png) 13px center no-repeat;
padding: 10px 10px 10px 35px !important;
}
/* responsive layout */
@media screen and (min-width: 1500px) {
body, input[type="text"], select, h4, td.names a, #filter p, #search td, p, a, textarea {
font-size: 10pt !important;
}
textarea, input[type="submit"], input[type="reset"] {
font-size: 9pt !important;
}
h3, #filter a, #navi a {
font-size: 11pt;
}
#filter a:link, #filter a:visited {
margin: 3px 2px !important;
}
}
/* export hosts button adjustments */
#export {
text-align: right;
margin-top: -48px;
margin-bottom: 23px;
padding-right: 4px;
float: right;
clear: left !important;
}
#export input[type="submit"] {
display: inline-block;
}
p#filtered {
padding-left: 35px !important;
padding-right: 250px !important;
}
p.book {
padding-left: 35px !important;
}
#messages + p, p.book {
border: 1px solid #2d295f;
background: #000 url(/themes/susidns/images/addressbook.png) 5px center no-repeat;
}

428
installer/resources/themes/susimail/classic/susimail.css
View File

@@ -4,7 +4,7 @@
body {
background: #eef url(/themes/console/classic/images/bg0.png);
color: #0c153d;
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Helvetica, sans-serif;
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
font-size: 9pt;
}
@@ -35,7 +35,6 @@ h3#config {
margin: 0 auto 10px;
background: url(/themes/console/classic/images/titlebg.png) right center no-repeat;
background: linear-gradient(to bottom, #fff 0%, #fff 50%, #eff2ff 50%, #eff2ff 100%);
box-shadow: 0 1px 0 1px #ddd;
border-radius: 0 0 2px 2px;
}
@@ -45,17 +44,15 @@ textarea[name="config_text"] {
li {
color: #0c153d;
line-height:12pt;
font-size: 8.5pt;
margin-left:5mm;
margin-right:5mm;
margin-left: 5mm;
margin-right: 5mm;
}
p {
color: #0c153d;
line-height:12pt;
margin-left:5mm;
margin-right:5mm;
margin-left: 5mm;
margin-right: 5mm;
font-size: 9pt;
}
@@ -113,9 +110,6 @@ p.footer {
font-size:8pt;
line-height:10pt;
text-align: center;
/* border-top: 1px solid #000;
padding-top: 5px;
margin-top: -10px; */
display: none;
}
@@ -168,44 +162,8 @@ td#attachedfile {
display: none;
}
/*
.iframed p:first-child {
display: none;
}
*/
/*
.mailbody {
display: block !important;
}
*/
/*
a {
color:#327BBF;
text-decoration:none;
font-weight: bold;
}
a.linkspam {
color:#927B40;
}
a.linknew {
color:#327B40;
}
a.linkold {
color:#327BBF;
}
a:hover {
text-decoration:underline;
color: #f60;
}
*/
a:link {
color: #006;
color: #33a;
text-decoration: none;
font-weight: bold;
word-wrap: break-word;
@@ -230,6 +188,14 @@ a:active {
font-weight: bold;
}
a.linkspam {
color: #8f1a1a;
}
a.linknew {
color: #2a7f00;
}
td {
color: #0c153d;
line-height: 12pt;
@@ -306,7 +272,16 @@ div#prefsave {
}
#mailbox th:first-child {
background: url(images/bin.png) center center no-repeat, linear-gradient(to bottom, #fff 0%, #fff 50%, #eff2ff 50%, #eff2ff 100%);
background: url(/themes/console/images/buttons/delete.png) center center no-repeat, linear-gradient(to bottom, #fff 0%, #fff 50%, #eff2ff 50%, #eff2ff 100%) !important;
}
#mailbox th:nth-child(2) {
background: url(/themes/susimail/images/status.png) center center no-repeat, linear-gradient(to bottom, #fff 0%, #fff 50%, #eff2ff 50%, #eff2ff 100%) !important;
background-blend-mode: luminosity;
}
#mailbox th:nth-child(4) {
background: url(/susimail/icons/attach.png) center right 3px no-repeat, linear-gradient(to bottom, #fff 0%, #fff 50%, #eff2ff 50%, #eff2ff 100%) !important;
}
#mailbox th:last-child, #mailbox td:last-child, #mailbox th:nth-last-child(3), #mailbox td:nth-last-child(3) {
@@ -368,6 +343,11 @@ div#prefsave {
-webkit-filter: drop-shadow(0 0 1px #f60);
}
img.sort {
height: 8px;
width: auto;
}
#newmail input[type="text"] {
width: 665px;
}
@@ -379,8 +359,8 @@ div#prefsave {
pre {
font: 8.5pt "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", Courier, mono;
margin-left:1cm;
margin-right:1cm;
margin-left: 1cm;
margin-right: 1cm;
}
.page {
@@ -450,8 +430,12 @@ table#message_full {
margin-bottom: -1px;
}
#message_full tr:last-child {
border-bottom: 1px solid #89f;
}
input, textarea { /* opera fix */
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Helvetica, sans-serif;
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
font-size: 9pt;
}
@@ -465,7 +449,7 @@ input[type="text"], input[type="password"], textarea {
input[type=submit] {
margin: 3px;
min-width: 60px;
/* min-width: 60px;*/
}
input.new_upload, input.delete_attachment {
@@ -487,28 +471,33 @@ button:focus, input[type="submit"]:focus, input[type="reset"]:focus {
}
button, input[type="submit"], input[type="reset"] {
padding: 5px !important;
padding: 5px;
border-radius: 2px;
color: #333;
border: 1px solid #bbb;
box-shadow: inset 0 0 0 1px #fff;
background: #eee;
background: linear-gradient(to bottom, #fff 0%, #ddd 100%);
min-width: 88px;
/* min-width: 88px;*/
outline: none !important;
filter: drop-shadow(0 0 1px #fff);
-webkit-filter: drop-shadow(0 0 1px #fff);
display: inline-block;
background-size: 14px 14px, 100% 100% !important;
}
input[type="file"] {
padding: 3px 2px;
}
button:hover, input[type="submit"]:hover, input[type="reset"]:hover {
button:hover, input[type="submit"]:hover, input[type="reset"]:hover,
button:focus, input[type="submit"]:focus, input[type="reset"]:focus {
color: #222;
background: #fff;
background: linear-gradient(to bottom, #ddd 0%, #fff 100%);
color: #222;
border: 1px solid #89f;
filter: drop-shadow(0 0 1px #89f);
-webkit-filter: drop-shadow(0 0 1px #89f);
}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
@@ -518,6 +507,10 @@ input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
button:active, input[type="submit"]:active, input[type="reset"]:active {
background: #ddd;
box-shadow: inset 3px 3px 3px #999;
box-shadow: inset 0 0 0 1px #fff, inset 3px 3px 3px #999;
color: #555;
border: 1px solid #bbb;
}
input[disabled][type="submit"], input[disabled][type="submit"]:hover, input[disabled][type="submit"]:active {
@@ -529,6 +522,314 @@ input.optbox {
vertical-align: middle;
}
/* illustrated images inc */
input.cancel {
background: #eee url(/themes/console/images/buttons/no.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/no.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.cancel:hover, input.cancel:focus {
background: #fff url(/themes/console/images/buttons/no.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/no.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.clearselection {
background: #eee url(/themes/susimail/images/none.png) no-repeat 7px center;
background: url(/themes/susimail/images/none.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.clearselection:hover, input.clearselection:focus {
background: #fff url(/themes/susimail/images/none.png) no-repeat 7px center;
background: url(/themes/susimail/images/none.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.delete, input.delete_attachment, input.really_delete {
background: #eee url(/themes/console/images/buttons/delete.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/delete.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.delete:hover, input.delete_attachment:hover, input.really_delete:hover,
input.delete:focus, input.delete_attachment:focus, input.really_delete:focus {
background: #fff url(/themes/console/images/buttons/delete_hover.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/delete_hover.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
.topbuttons input.delete {
margin-left: 0;
}
input.download {
background: #eee url(/themes/console/images/buttons/download.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/download.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.download:hover, input.download:focus {
background: #fff url(/themes/console/images/buttons/download.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/download.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.offline {
background: #eee url(/themes/susimail/images/offline.png) no-repeat 7px center;
background: url(/themes/susimail/images/offline.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.offline:hover, input.offline:focus {
background: #fff url(/themes/susimail/images/offline_hover.png) no-repeat 7px center;
background: url(/themes/susimail/images/offline_hover.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.list {
background: #eee url(/themes/susimail/images/folder.png) no-repeat 7px center;
background: url(/themes/susimail/images/folder.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.list:hover, input.list:focus {
background: #eee url(/themes/susimail/images/folder-open.png) no-repeat 7px center;
background: url(/themes/susimail/images/folder-open.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.forward {
background: #eee url(/themes/susimail/images/forward.png) no-repeat 7px center;
background: url(/themes/susimail/images/forward.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.forward:hover, input.forward:focus {
background: #fff url(/themes/susimail/images/forward.png) no-repeat 7px center;
background: url(/themes/susimail/images/forward.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.login {
background: #eee url(/themes/susimail/images/login.png) no-repeat 7px center;
background: url(/themes/susimail/images/login.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.login:hover, input.login:focus {
background: #fff url(/themes/susimail/images/login_hover.png) no-repeat 7px center;
background: url(/themes/susimail/images/login_hover.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.logout {
background: #eee url(/themes/susimail/images/logout.png) no-repeat 7px center;
background: url(/themes/susimail/images/logout.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.logout:hover, input.logout:focus {
background: #fff url(/themes/susimail/images/logout_hover.png) no-repeat 7px center;
background: url(/themes/susimail/images/logout_hover.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.reload, input.refresh {
background: #eee url(/themes/console/images/buttons/update.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/update.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.reload:hover, input.refresh:hover, input.reload:focus, input.refresh:focus {
background: #eee url(/themes/console/images/buttons/update_hover.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/update_hover.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.invertselection {
background: #eee url(/themes/susimail/images/selection.png) no-repeat 7px center;
background: url(/themes/susimail/images/selection.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.invertselection:hover, input.invertselection:focus {
background: #eee url(/themes/susimail/images/selection.png) no-repeat 7px center;
background: url(/themes/susimail/images/selection.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.show {
background: #eee url(/themes/console/images/buttons/yes.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/yes.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.show:hover, input.show:focus {
background: #fff url(/themes/console/images/buttons/yes.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/yes.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
padding: 5px 8px 5px 24px;
}
input.markall {
background: #eee url(/themes/susimail/images/all.png) no-repeat 7px center;
background: url(/themes/susimail/images/all.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.markall:hover, input.markall:focus {
background: #fff url(/themes/susimail/images/all.png) no-repeat 7px center;
background: url(/themes/susimail/images/all.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.new {
background: #eee url(/themes/susimail/images/compose.png) no-repeat 7px center;
background: url(/themes/susimail/images/compose.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.new:hover, input.new:focus {
background: #fff url(/themes/susimail/images/compose_hover.png) no-repeat 7px center;
background: url(/themes/susimail/images/compose_hover.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.reply {
background: #eee url(/themes/susimail/images/reply.png) no-repeat 7px center;
background: url(/themes/susimail/images/reply.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.reply:hover, input.reply:focus {
background: #fff url(/themes/susimail/images/reply.png) no-repeat 7px center;
background: url(/themes/susimail/images/reply.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.replyall {
background: #eee url(/themes/susimail/images/reply-all.png) no-repeat 7px center;
background: url(/themes/susimail/images/reply-all.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.replyall:hover, input.replyall:focus {
background: #fff url(/themes/susimail/images/reply-all.png) no-repeat 7px center;
background: url(/themes/susimail/images/reply-all.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.setpagesize, input.save {
background: #eee url(/themes/console/images/buttons/yes.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/yes.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.setpagesize:hover, input.save:hover, input.setpagesize:focus, input.save:focus {
background: #fff url(/themes/console/images/buttons/yes.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/yes.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
padding: 5px 8px 5px 24px;
}
input.send {
background: #eee url(/themes/susimail/images/send.png) no-repeat 7px center;
background: url(/themes/susimail/images/send.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.send:hover, input.send:focus {
background: #fff url(/themes/susimail/images/send_hover.png) no-repeat 7px center;
background: url(/themes/susimail/images/send_hover.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.configure {
background: #eee url(/themes/console/images/buttons/configure.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/configure.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.configure:hover, input.configure:focus {
background: #fff url(/themes/console/images/buttons/configure_hover.png) no-repeat 7px center;
background: url(/themes/console/images/buttons/configure_hover.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.saveas {
background: #eee url(/themes/susimail/images/save.png) no-repeat 7px center;
background: url(/themes/susimail/images/save.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.saveas:hover, input.saveas:focus {
background: #fff url(/themes/susimail/images/save_hover.png) no-repeat 7px center;
background: url(/themes/susimail/images/save_hover.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.new_upload {
background: #eee url(/themes/susimail/images/attach.png) no-repeat 7px center;
background: url(/themes/susimail/images/attach.png) no-repeat 7px center, linear-gradient(to bottom, #fff 0%, #ddd 100%);
padding: 5px 8px 5px 24px;
}
input.new_upload:hover, input.new_upload:focus {
background: #fff url(/themes/susimail/images/attach.png) no-repeat 7px center;
background: url(/themes/susimail/images/attach.png) no-repeat 7px center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
padding: 5px 8px 5px 24px;
}
/* pagenav */
input.firstpage, input[name="firstpage"],
input.firstpage[disabled]:hover, input[name="firstpage"][disabled]:hover,
input.firstpage[disabled]:focus, input[name="firstpage"][disabled]:focus {
background: #eee url(/themes/susimail/images/first.png) no-repeat center center !important;
background: url(/themes/susimail/images/first.png) no-repeat center center, linear-gradient(to bottom, #fff 0%, #ddd 100%) !important;
padding: 5px 14px !important;
text-indent: -99999px;
}
input.firstpage:hover, input[name="firstpage"]:hover,
input.firstpage:focus, input[name="firstpage"]:focus {
background: #fff url(/themes/susimail/images/first.png) no-repeat center center;
background: url(/themes/susimail/images/first.png) no-repeat center center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.lastpage, input[name="lastpage"],
input.lastpage[disabled]:hover, input[name="lastpage"][disabled]:hover,
input.lastpage[disabled]:focus, input[name="lastpage"][disabled]:focus {
background: #eee url(/themes/susimail/images/last.png) no-repeat center center !important;
background: url(/themes/susimail/images/last.png) no-repeat center center, linear-gradient(to bottom, #fff 0%, #ddd 100%) !important;
padding: 5px 14px !important;
text-indent: -99999px;
}
input.lastpage:hover, input[name="lastpage"]:hover,
input.lastpage:focus, input[name="lastpage"]:focus {
background: #fff url(/themes/susimail/images/last.png) no-repeat center center;
background: url(/themes/susimail/images/last.png) no-repeat center center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.prevpage, input.prev, input[name="prev"], input[name="prevpage"],
input.prevpage[disabled]:hover, input.prev[disabled]:hover, input[name="prev"][disabled]:hover, input[name="prevpage"][disabled]:hover,
input.prevpage[disabled]:focus, input.prev[disabled]:focus, input[name="prev"][disabled]:focus, input[name="prevpage"][disabled]:focus {
background: #eee url(/themes/susimail/images/previous.png) no-repeat center center;
background: url(/themes/susimail/images/previous.png) no-repeat center center, linear-gradient(to bottom, #fff 0%, #ddd 100%) !important;
padding: 5px 14px !important;
text-indent: -99999px;
}
input.prevpage:hover, input.prev, input[name="prev"]:hover, input[name="prevpage"]:hover,
input.prevpage:focus, input.prev, input[name="prev"]:focus, input[name="prevpage"]:focus {
background: #fff url(/themes/susimail/images/previous.png) no-repeat center center;
background: url(/themes/susimail/images/previous.png) no-repeat center center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
input.nextpage, input.next, input[name="nextpage"], input[name="next"],
input.nextpage[disabled]:hover, input.next[disabled]:hover, input[name="nextpage"][disabled]:hover, input[name="next"][disabled]:hover,
input.nextpage[disabled]:focus, input.next[disabled]:focus, input[name="nextpage"][disabled]:focus, input[name="next"][disabled]:focus {
background: #eee url(/themes/susimail/images/next.png) no-repeat center center;
background: url(/themes/susimail/images/next.png) no-repeat center center, linear-gradient(to bottom, #fff 0%, #ddd 100%) !important;
padding: 5px 14px !important;
text-indent: -99999px;
}
input.nextpage:hover, input.next:hover, input[name="nextpage"]:hover,
input.nextpage:focus, input.next:focus, input[name="nextpage"]:focus {
background: #fff url(/themes/susimail/images/next.png) no-repeat center center;
background: url(/themes/susimail/images/next.png) no-repeat center center, linear-gradient(to bottom, #ddd 0%, #fff 100%);
}
/* end pagenav */
/* end illustrated images */
div#composemail {
text-align: center !important;
padding: 10px;
@@ -578,7 +879,7 @@ div#mailheader {
}
div#dologin {
border: 1px solid #89f;
border: 1px solid #777;
padding: 10px 0 0;
width: 500px;
margin: 60px auto 40px;
@@ -605,6 +906,9 @@ div#dologin {
padding: 4px 5px 4px 26px !important;
}
#dologin input[name="host"] {
width: calc(65% + 26px) !important;
}
#dologin table {
width: 100%;
@@ -616,15 +920,17 @@ div#dologin {
#dologin td {
padding: 3px;
font-weight: bold !important;
color: #333;
}
#dologin td:first-child {
white-space: nowrap;
padding-left: 0;
width: 120px !important;
}
#dologin td:last-child {
width: 80%;
width: auto !important;
padding-right: 0;
}
@@ -637,7 +943,7 @@ div#dologin {
}
#dologin h1 {
border-bottom: 1px solid #89f;
border-bottom: 1px solid #777;
padding: 10px 15px;
margin: -10px 0 10px;
font-size: 14pt;
@@ -652,7 +958,7 @@ div#dologin {
#dologin hr {
display: block !important;
background: #89f;
background: #777;
box-shadow: 0 1px 0 1px #fff;
}

86
installer/resources/themes/susimail/dark/susimail.css
View File

@@ -6,7 +6,7 @@
body {
background-color: #000;
color:#ee9;
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Helvetica, sans-serif;
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
font-size: 9pt;
margin: 8px 5px;
}
@@ -17,6 +17,16 @@ body.iframed {
padding-top: 0;
}
::selection {
background: #030 !important;
color: white;
}
::-moz-selection {
background: #030 !important;
color: white;
}
div.header {
padding: 8px 5px 12px 5px;
}
@@ -172,6 +182,21 @@ table#mailbox {
margin-bottom: -10px;
}
#mailbox th:first-child {
padding: 0 !important;
background: url(/themes/console/images/buttons/delete.png) center center no-repeat, linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000000 56%, #000000 100%) !important;
}
#mailbox th:nth-child(2) {
background: url(/themes/susimail/images/status.png) center center no-repeat, linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000000 56%, #000000 100%) !important;
background-blend-mode: luminosity;
}
#mailbox th:nth-child(4) {
background: url(/susimail/icons/attach.png) center right 5px no-repeat, linear-gradient(to bottom, #1a261a 0%, #223022 7%, #212f21 9%, #172317 21%, #091109 49%, #050d05 50%, #020602 51%, #010301 53%, #000000 56%, #000000 100%) !important;
}
table#mailbox td[colspan="5"], table#mailbox td[colspan="4"] {
border-top: 1px solid #494 !important;
padding: 6px 0 2px !important;
@@ -234,35 +259,24 @@ input.optbox:hover {
-webkit-filter: drop-shadow(0 0 2px #f60);
}
#attachedfile {
border-bottom: 1px dotted #151;
padding: 5px 5px 5px 8px !important;
}
td#attachedfile:last-child {
padding-left: 10px;
}
td#deleteattached {
padding: 5px 10px 0 !important;
padding: 5px 5px 0 !important;
text-align: right;
border-top: 1px solid #131;
}
tr.bottombuttons:last-child td {
padding-bottom: 20px !important;
}
/*
p img {
display: none;
height: 0;
width: 0;
margin: -20px 0;
}
*/
/*
p:first-child {
display: none;
}
*/
a:link {
color: #f60;
color: #5a5;
@@ -464,7 +478,7 @@ textarea[name="new_text"] {
}
td#addattach {
padding: 0 10px 15px !important;
padding: 0 10px 10px !important;
border-bottom: 1px solid #131;
}
@@ -653,10 +667,11 @@ input[type=submit]:hover, input.cancel:hover, input[type=submit]:focus, input.ca
}
input[type=submit]:active, input.cancel:active {
border: 1px inset #f60;
border: 1px solid #f60;
background: #f60 !important;
color: #EE9 !important;
box-shadow: inset 0 0 0 1px #000;
box-shadow: inset 3px 3px 3px #000;
box-shadow: inset 0 0 0 1px #000, inset 3px 3px 3px #000;
}
#dologin input:disabled, #dologin input:disabled:hover, #dologin input:disabled:active {
@@ -697,6 +712,7 @@ input[type="text"], input[type="password"], textarea {
border: 1px solid #363;
background: linear-gradient(to bottom, #000 0%, #010 100%) !important;
box-shadow: inset 0 0 3px 3px #000;
font-size: 9pt;
}
input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
@@ -707,6 +723,24 @@ input[type="text"]:focus, input[type="password"]:focus, textarea:focus {
transition: ease filter 0.3s 0s;
}
input[name="user"] {
background: url(/themes/console/images/buttons/user.png) 5px center no-repeat, linear-gradient(to bottom, #000 0%, #010 100%) !important;
padding: 5px 5px 5px 25px !important;
}
input[name="user"]:focus {
background: #000 url(/themes/console/images/buttons/user.png) 5px center no-repeat !important;
}
input[name="pass"] {
background: url(/themes/console/images/buttons/password.png) 5px center no-repeat, linear-gradient(to bottom, #000 0%, #010 100%) !important;
padding: 5px 5px 5px 25px !important;
}
input[name="pass"]:focus {
background: #000 url(/themes/console/images/buttons/password.png) 5px center no-repeat !important;
}
input.delete {
margin-left: 5px;
}
@@ -1086,9 +1120,17 @@ body, td, textarea, div, p.mailbody {
}
@media screen and (min-width: 1500px) {
input {
input, textarea {
font-size: 10pt !important;
}
select, button, input[type="submit"], input[type="reset"] {
font-size: 9pt;
}
textarea[name="new_text"] {
width: 660px;
}
}
@media screen and (max-width: 600px) {

12
installer/resources/themes/susimail/light/susimail.css
View File

@@ -399,6 +399,10 @@ input {
cursor: pointer;
}
input[type="radio"], input[type="checkbox"] {
vertical-align: middle;
}
input[type="text"], input[type="password"] {
cursor: text;
}
@@ -1136,6 +1140,14 @@ td p.error {
padding: 10px;
}
#attachedfile input[type="checkbox"] {
margin: 0 2px 0 0;
}
#attachedfile {
border-bottom: 1px dotted #7778bf;
}
.attached {
text-align: left;
background: url(/themes/susimail/images/attach.png) 10px center no-repeat;

395
installer/resources/themes/susimail/midnight/susimail.css
View File

@@ -4,7 +4,7 @@
body {
background-color: #000;
color: #C9CEFF;
color: #c9ceff;
font-family: "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
font-size: 9pt;
margin: 6px 5px;
@@ -34,7 +34,7 @@ hr {
}
li {
color: #C9CEFF;
color: #c9ceff;
line-height: 12pt;
font-size: 10pt;
margin-left: 5mm;
@@ -42,7 +42,7 @@ li {
}
p {
color: #C9CEFF;
color: #c9ceff;
line-height: 12pt;
margin-left: 5mm;
margin-right: 5mm;
@@ -62,7 +62,7 @@ p.text {
}
p.info, p.error {
color: #C9CEFF;
color: #c9ceff;
display: block !important;
border: 1px solid #443da0;
margin: 20px 20px 0 !important;
@@ -169,6 +169,29 @@ table#mailbox {
margin-bottom: 0;
}
#mailbox th:first-child {
background: url(/themes/console/images/buttons/delete.png) center center no-repeat, linear-gradient(to bottom, #191729 0%, #201f33 7%, #1f1e32 9%, #161525 21%, #090812 49%, #05050e 50%, #020206 51%, #010103 53%, #000000 56%, #000000 100%) !important;
font-size: 0;
padding: 0;
}
#mailbox th:nth-child(2) {
background: url(/themes/susimail/images/status.png) center center no-repeat, linear-gradient(to bottom, #191729 0%, #201f33 7%, #1f1e32 9%, #161525 21%, #090812 49%, #05050e 50%, #020206 51%, #010103 53%, #000000 56%, #000000 100%) !important;
font-size: 0;
padding: 0;
background-blend-mode: luminosity;
}
#mailbox th:nth-child(3) {
text-align: left;
}
#mailbox th:nth-child(4) {
background: url(/susimail/icons/attach.png) center right 5px no-repeat, linear-gradient(to bottom, #191729 0%, #201f33 7%, #1f1e32 9%, #161525 21%, #090812 49%, #05050e 50%, #020206 51%, #010103 53%, #000000 56%, #000000 100%) !important;
font-size: 0;
padding: 0;
}
table#mailbox td[colspan="5"], table#mailbox td[colspan="4"] {
border-top: 1px solid #443da0 !important;
padding: 6px 0 2px !important;
@@ -229,6 +252,7 @@ input.optbox:hover {
input[type="checkbox"], .optbox {
min-width: 16px !important;
min-height: 16px !important;
filter: invert(100%) sepia(100%) hue-rotate(200deg) saturate(200%); /* colorize radios and checkboxes */
-webkit-filter: invert(100%) sepia(100%) hue-rotate(200deg) saturate(200%);
}
@@ -237,6 +261,16 @@ td#deleteattached {
padding-top: 5px !important;
}
#attachedfile input[type="checkbox"] {
margin: 0 2px 0 0;
vertical-align: middle;
}
#attachedfile {
border-bottom: 1px dotted #322e6b;
padding: 5px 5px 5px 8px !important;
}
tr.bottombuttons:last-child td {
padding-bottom: 20px !important;
}
@@ -262,7 +296,7 @@ a:active {
}
td {
color: #C9CEFF;
color: #c9ceff;
margin: 0 5px;
font-size: 9pt;
padding: 2px;
@@ -284,7 +318,7 @@ tr.list0 td, tr.list1 td {
}
tr.list0:hover td, tr.list1:hover td {
color: #C9CEFF;
color: #c9ceff;
}
tr.list0:hover, tr.list1:hover, tr.list0:hover a, tr.list1:hover a {
@@ -293,7 +327,7 @@ tr.list0:hover, tr.list1:hover, tr.list0:hover a, tr.list1:hover a {
}
tr.list0:hover td:nth-child(3) a, tr.list1:hover td:nth-child(3) a {
color: #C9CEFF !important;
color: #c9ceff !important;
}
@@ -393,7 +427,7 @@ pre {
}
.page {
color: #C9CEFF;
color: #c9ceff;
margin: 0;
padding: 0;
font-size: 9pt !important;
@@ -429,7 +463,7 @@ form table {
textarea {
background: #000;
color: #C9CEFF;
color: #c9ceff;
border: 1px solid #443da0;
border-radius: 2px;
padding: 5px;
@@ -504,30 +538,39 @@ input {
border: 1px solid #443da0;
color: #443da0;
margin: 3px;
font: bold 8pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Lato, "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
min-width: 64px !important;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
/* min-width: 64px !important;*/
}
input.optbox {
min-width: 16px !important;
min-height: 16px !important;
}
input[type=submit]::-moz-focus-inner, input.cancel::-moz-focus-inner {
border: none;
box-shadow: none;
}
input[type=submit], input.cancel {
color: #443da0;
background: #000;
background: linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
border: 1px solid #3e3f8f;
border-bottom-color: #14144f;
border-right-color: #14144f;
font: bold 8pt "Droid Sans", "Noto Sans", "Bitstream Vera Sans", "Lucida Grande", "DejaVu Sans", Lato, "Segoe UI", Verdana, Tahoma, Helvetica, sans-serif;
font: bold 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
text-align: center;
padding: 4px 8px !important;
min-width: 95px !important;
padding: 5px 8px !important;
/* min-width: 95px !important;*/
margin: 4px 5px;
box-shadow: inset 0 0 0 1px #000;
}
input[type=submit]:hover, input.cancel:hover {
input[type=submit]:hover, input.cancel:hover,
input[type=submit]:focus, input.cancel:focus {
color: #652787;
background: #000;
background: #000 !important;
border: 1px solid #652787;
box-shadow: inset 0 1px 1px 0 #c9ceff;
}
@@ -535,8 +578,9 @@ input[type=submit]:hover, input.cancel:hover {
input[type=submit]:active, input.cancel:active {
border: 1px inset #652787;
background: #652787 !important;
color: #C9CEFF !important;
box-shadow: inset 0px 0px 0px 0px #652787;
color: #c9ceff !important;
box-shadow: inset 3px 3px 3px #000 !important;
box-shadow: inset 0 0 0 1px #000, inset 3px 3px 3px #000 !important;
}
input[type=text], input[type=password], textarea {
@@ -549,7 +593,7 @@ input[type=text], input[type=password], textarea {
#dologin input:disabled, #dologin input:disabled:hover, #dologin input:disabled:active {
border: none;
color: #652787;
color: #9b9ebf;
margin: 0;
padding-top: 3px;
box-shadow: none;
@@ -565,7 +609,7 @@ input[name="user"], input[name="pass"] {
input[name="user"]:focus, input[name="pass"]:focus, input[type="text"]:focus, textarea:focus {
border: 1px solid #443da0;
color: #C9CEFF;
color: #c9ceff;
}
input[name="host"], input[name="pop3"], input[name="smtp"] {
@@ -621,6 +665,7 @@ div#dologin {
background: #020020 url("/themes/console/images/email.png") 8px center no-repeat;
background: url("images/mail.png") 8px center no-repeat, linear-gradient(to bottom, #191729 0%, #201f33 7%, #1f1e32 9%, #161525 21%, #090812 49%, #05050e 50%, #020206 51%, #010103 53%, #000000 56%, #000000 100%) !important;
text-shadow: 0 1px 1px #000;
box-shadow: inset 0 0 0 1px #000;
}
#dologin table {
@@ -757,10 +802,6 @@ table#pagenav {
background: linear-gradient(to bottom, #010010 0%, #020019 50%, #060051%, #0100100%) !important;
}
table#pagenav tr:hover td {
color: #C9CEFF;
}
table#pagenav td {
white-space: nowrap;
font-size: 10pt;
@@ -769,7 +810,7 @@ table#pagenav td {
word-spacing: 0.1em;
padding: 3px 5px;
text-align: center;
color: #7670c2;
color: #c9ceff;
}
table#pagenav td:first-child {
@@ -902,6 +943,295 @@ div#bottombuttons { /* config page button positioning */
padding: 10px 10px 20px;
}
/* illustrated buttons inc */
input[type="submit"][class], input[type="cancel"][class],
input[type="submit"][class]:hover, input[type="cancel"][class]:hover,
input[type="submit"][class]:focus, input[type="cancel"][class]:focus {
background-size: 14px 14px, 100% 100% !important;
}
input.cancel {
background: #000 url(/themes/console/images/buttons/no.png) no-repeat 6px center !important;
background: url(/themes/console/images/buttons/no.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.cancel:hover, input.cancel:focus {
background: #000 url(/themes/console/images/buttons/no.png) no-repeat 6px center !important;
}
input.clearselection {
background: #000 url(/themes/susimail/images/none.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/none.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.clearselection:hover, input.clearselection:focus {
background: #000 url(/themes/susimail/images/none.png) no-repeat 6px center !important;
}
input.delete, input.delete_attachment, input.really_delete {
background: #000 url(/themes/console/images/buttons/delete.png) no-repeat 6px center !important;
background: url(/themes/console/images/buttons/delete.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.delete:hover, input.delete_attachment:hover, input.really_delete:hover,
input.delete:focus, input.delete_attachment:focus, input.really_delete:focus {
background: #000 url(/themes/console/images/buttons/delete_hover.png) no-repeat 6px center !important;
}
input.download {
background: #000 url(/themes/console/images/buttons/download.png) no-repeat 6px center !important;
background: url(/themes/console/images/buttons/download.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.download:hover, input.download:focus {
background: #000 url(/themes/console/images/buttons/download.png) no-repeat 6px center !important;
}
input.offline {
background: #000 url(/themes/susimail/images/offline.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/offline.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.offline:hover, input.offline:focus {
background: #000 url(/themes/susimail/images/offline_hover.png) no-repeat 6px center !important;
}
input.list {
background: #000 url(/themes/susimail/images/folder.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/folder.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.list:hover, input.list:focus {
background: #000 url(/themes/susimail/images/folder-open.png) no-repeat 6px center !important;
}
input.forward {
background: #000 url(/themes/susimail/images/forward.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/forward.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.forward:hover, input.forward:focus {
background: #000 url(/themes/susimail/images/forward.png) no-repeat 6px center !important;
}
input.login {
background: #000 url(/themes/susimail/images/login.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/login.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.login:hover, input.login:focus {
background: #000 url(/themes/susimail/images/login_hover.png) no-repeat 6px center !important;
}
input.logout {
background: #000 url(/themes/susimail/images/logout.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/logout.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.logout:hover, input.logout:focus {
background: #000 url(/themes/susimail/images/logout_hover.png) no-repeat 6px center !important;
}
input.reload, input.refresh {
background: #000 url(/themes/console/images/buttons/update.png) no-repeat 6px center !important;
background: url(/themes/console/images/buttons/update.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.reload:hover, input.refresh:hover,
input.reload:focus, input.refresh:focus {
background: #000 url(/themes/console/images/buttons/update_hover.png) no-repeat 6px center !important;
}
input.invertselection {
background: #000 url(/themes/susimail/images/selection.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/selection.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.invertselection:hover, input.invertselection:focus {
background: #000 url(/themes/susimail/images/selection.png) no-repeat 6px center !important;
}
input.show {
background: #000 url(/themes/console/images/buttons/yes.png) no-repeat 6px center !important;
background: url(/themes/console/images/buttons/yes.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.show:hover, input.show:focus {
background: #000 url(/themes/console/images/buttons/yes.png) no-repeat 6px center !important;
}
input.markall {
background: #000 url(/themes/susimail/images/all.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/all.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.markall:hover, input.markall:focus {
background: #000 url(/themes/susimail/images/all.png) no-repeat 6px center !important;
}
input.new {
background: #000 url(/themes/susimail/images/compose.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/compose.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.new:hover, input.new:focus {
background: #000 url(/themes/susimail/images/compose_hover.png) no-repeat 6px center !important;
}
input.reply {
background: #000 url(/themes/susimail/images/reply.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/reply.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.reply:hover, input.reply:focus {
background: #000 url(/themes/susimail/images/reply.png) no-repeat 6px center !important;
}
input.replyall {
background: #000 url(/themes/susimail/images/reply-all.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/reply-all.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.replyall:hover, input.replyall:focus {
background: #000 url(/themes/susimail/images/reply-all.png) no-repeat 6px center !important;
}
input.setpagesize, input.save {
background: #000 url(/themes/console/images/buttons/yes.png) no-repeat 6px center !important;
background: url(/themes/console/images/buttons/yes.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.setpagesize:hover, input.save:hover,
input.setpagesize:focus, input.save:focus {
background: #000 url(/themes/console/images/buttons/yes.png) no-repeat 6px center !important;
}
input.send {
background: #000 url(/themes/susimail/images/send.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/send.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.send:hover, input.send:focus {
background: #000 url(/themes/susimail/images/send_hover.png) no-repeat 6px center !important;
}
input.configure {
background: #000 url(/themes/console/images/buttons/configure.png) no-repeat 6px center !important;
background: url(/themes/console/images/buttons/configure.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.configure:hover, input.configure:focus {
background: #000 url(/themes/console/images/buttons/configure_hover.png) no-repeat 6px center !important;
}
input.saveas {
background: #000 url(/themes/susimail/images/save.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/save.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
input.saveas:hover, input.saveas:focus {
background: #000 url(/themes/susimail/images/save_hover.png) no-repeat 6px center !important;
}
input.new_upload {
background: #000 url(/themes/susimail/images/attach.png) no-repeat 6px center !important;
background: url(/themes/susimail/images/attach.png) no-repeat 6px center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 5px 5px 22px !important;
}
/* pagenav */
input.firstpage, input[name="firstpage"],
input.firstpage[disabled]:hover, input[name="firstpage"][disabled]:hover {
background: #000 url(/themes/susimail/images/first.png) no-repeat center center;
background: url(/themes/susimail/images/first.png) no-repeat center center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 10px !important;
text-indent: -99999px;
background-size
}
input.firstpage:hover, input[name="firstpage"]:hover,
input.firstpage:focus, input[name="firstpage"]:focus {
background: #000 url(/themes/susimail/images/first.png) no-repeat center center;
}
input.lastpage, input[name="lastpage"],
input.lastpage[disabled]:hover, input[name="lastpage"][disabled]:hover,
input.lastpage[disabled]:focus, input[name="lastpage"][disabled]:focus {
background: #000 url(/themes/susimail/images/last.png) no-repeat center center;
background: url(/themes/susimail/images/last.png) no-repeat center center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 10px !important;
text-indent: -99999px;
}
input.lastpage:hover, input[name="lastpage"]:hover,
input.lastpage:focus, input[name="lastpage"]:focus {
background: #000 url(/themes/susimail/images/last.png) no-repeat center center;
}
input.prevpage, input.prev, input[name="prev"], input[name="prevpage"],
input.prevpage[disabled]:hover, input.prev[disabled]:hover, input[name="prev"][disabled]:hover, input[name="prevpage"][disabled]:hover,
input.prevpage[disabled]:focus, input.prev[disabled]:focus, input[name="prev"][disabled]:focus, input[name="prevpage"][disabled]:focus {
background: #000 url(/themes/susimail/images/previous.png) no-repeat center center;
background: url(/themes/susimail/images/previous.png) no-repeat center center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 10px !important;
text-indent: -99999px;
}
input.prevpage:hover, input.prev, input[name="prev"]:hover, input[name="prevpage"]:hover,
input.prevpage:focus, input.prev, input[name="prev"]:focus, input[name="prevpage"]:focus {
background: #000 url(/themes/susimail/images/previous.png) no-repeat center center;
}
input.nextpage, input.next, input[name="nextpage"], input[name="next"],
input.nextpage[disabled]:hover, input.next[disabled]:hover, input[name="nextpage"][disabled]:hover, input[name="next"][disabled]:hover,
input.nextpage[disabled]:focus, input.next[disabled]:focus, input[name="nextpage"][disabled]:focus, input[name="next"][disabled]:focus {
background: #000 url(/themes/susimail/images/next.png) no-repeat center center;
background: url(/themes/susimail/images/next.png) no-repeat center center, linear-gradient(to bottom, #1f1e32, #090812 50%, #000 50%) !important;
padding: 5px 10px !important;
text-indent: -99999px;
}
input.nextpage:hover, input.next:hover, input[name="nextpage"]:hover,
input.nextpage:focus, input.next:focus, input[name="nextpage"]:focus {
background: #000 url(/themes/susimail/images/next.png) no-repeat center center;
}
/* end pagenav */
/* end illustrated buttons */
input[type=submit]:active, input.cancel:active {
border: 1px solid #652787;
background-color: #652787 !important;
background-blend-mode: luminosity;
color: #c9ceff !important;
box-shadow: inset 3px 3px 3px #000 !important;
box-shadow: inset 0 0 0 1px #000, inset 3px 3px 3px #000 !important;
}
/* responsive layout */
@media screen and (min-width: 1024px) {
@@ -909,22 +1239,19 @@ body, td, textarea, div, p.mailbody {
font-size: 10pt !important;
}
input {
font-size: 9pt !important;
}
#pagenav input {
font-size: 0 !important;
}
.topbuttons input[type="submit"], .topbuttons input[type="reset"] {
margin: 3px 5px !important;
}
}
@media screen and (min-width: 1500px) {
input {
font-size: 10pt !important;
font-size: 9pt !important;
}
#pagenav input {
font-size: 0 !important;
}
}